Claude design templates: every source, free and paid

"Claude design templates" means four different things, and Google's own AI Overview mixes them up. Inside Claude Design, templates are the starting points you pick when you open an artifact. Separately, a DESIGN.md file is the thing that makes every template come out in your brand, and that is the file most people are actually hunting for. Then there are Claude Code component templates and Claude prompt templates, which are not design at all.

Search "free claude design templates" today and the AI Overview answers with aitmpl.com (1,000+ Claude Code components), the davila7/claude-code-templates CLI (32,963 stars, MIT), 8B's 20 free HTML templates and a browser extension full of prompt templates. Useful things. None of them is a Claude Design template.

Here is the whole field, sorted by what you get and what it costs, with numbers checked on 29 October 2026.

Why the distinction matters more than the list

• A template controls the layout, a design system controls the look. Pick the slides template and you get slides. Hand Claude a DESIGN.md first and you get slides in your colours, type scale and component language.
• The built-in templates are free on every plan. Anthropic's help centre states Claude Design "is available on Free, Pro, Max, Team, and Enterprise plans, and it's on by default."
• Custom templates are a duplicate, not an upload. You cannot import a template file. You promote one of your own projects into the Templates shelf.
• The free catalogs are bigger than the paid ones. The largest paid archive in this list holds 139 references. Two free catalogs hold 312 and 550+.
• Most "Claude template" repos are Claude Code repos. Agents, slash commands, hooks and MCP config. Different product, different file formats, zero design tokens.

1. Claude Design's built-in templates

The starting points inside the product itself, at claude.ai/design.

What it does:

• Opens a design artifact from a named starting point rather than a blank prompt
• Covers build and prototype shapes: mobile app design, UI mockups, web design, wireframes, 3D objects, colour and type pairing
• Covers publishing shapes: slide decks, documents, reports, invoices, handouts, résumés, flyers, HTML emails
• Covers explainer shapes: research reports, visual diagrams, animation and motion graphics
• Inherits your organisation's design system automatically once one exists

Best for: anyone who just wants to start, and for finding out which shapes Claude Design is good at before investing in a system.

Why it makes the list: it is the only source that is literally first-party. The Claude help centre describes Claude Design as letting you "create designs, interactive prototypes, one-pagers, and other visual work by chatting with Claude," and the template shelf is the front door to that. The Everyday AI podcast's episode 824 walkthrough lists the suggested set as "mobile app design, slides, documents, wireframes, animation, UI mock ups, resume, three d object."

Tip: the built-in templates are shape, not style. Load a design system before you pick one, or you get the house aesthetic.

2. Your own projects, duplicated into templates

The answer to the most-asked question on this query, and it is a product mechanic rather than a download.

What it does:

• Turns a finished project into a reusable starting point from the project menu
• Populates the otherwise empty Templates section on the Claude Design homepage
• Keeps the design system attached, so the template carries your tokens
• Works without any external file or marketplace

Best for: teams that build the same kind of artifact repeatedly, like a weekly report or a pitch deck.

Why it makes the list: the r/ClaudeAI thread "How to create Templates in Claude Design?" is ranked fourth on this query because it is the only place the mechanic is written down plainly. Its opening post quotes the empty state verbatim: "On the Claude Design homepage, there's a "Templates" section with the verbiage "No templates yet. Create one from any project via the project menu → Duplicate ..."" Google's AI Overview for the query summarises the thread's answer as exporting a project as a .zip, uploading it back into the design system chat, and asking Claude to convert it into a reusable template.

Tip: if your Templates shelf is empty, nothing is broken. It fills up only from your own projects.

3. awesome-claude-design (VoltAgent)

The free list that ranks third on this query and gets cited in the AI Overview.

What it does:

• Indexes 68 design system inspirations in DESIGN.md format, by its own count badge
• MIT licensed, 4,245 stars as of 29 October 2026
• Groups entries by category: AI platforms, developer tools, backend, productivity, design tools, fintech
• Documents both load routes: upload under Add assets when creating a design system at claude.ai/design/#org, or attach the file in a prototype chat and say "Create a design system from this DESIGN.md"
• Lists what Claude returns: a README with brand context, a colors_and_type.css with variables and type scale, Google Fonts substitutes for proprietary faces, preview cards, a working UI kit, and a portable SKILL.md

Best for: finding out which brand aesthetic you want before you commit to a catalog.

Why it makes the list: it is the clearest published explanation of the two upload routes, and the AI Overview treats it as the canonical preset package. One thing to know before you plan around it: the repository root holds only a README and a LICENSE. Every one of the 68 collection items is a link to a getdesign.md entry page, so the repo is a curated index into a commercial catalog rather than 68 files you can clone.

Tip: read the repo's own framing honestly. It calls the entries "curated starting points inspired by publicly observable design patterns," not official brand systems.

4. getdesign.md

The catalog those 68 links point at, by the same maintainers.

What it does:

• Publishes 550+ brand analyses, each on its own entry page
• Offers a direct install command per entry, for example npx getdesign@latest add claude
• Offers a Download DESIGN.md button with no sign-in on the entries we checked
• Describes each system in one line, so you can scan for a feel
• Sells a Catalog Pass for bulk access on top of the free entries

Best for: breadth. If you want a specific brand's look and it has a public website, it is probably in here.

Why it makes the list: volume plus a working CLI install. The limitation is the same one any bulk extraction has: the one-line summaries are generated from what the site renders, and they drift. Its Cursor entry currently reads "Cursor is designed around AI-first code editor and uses sleek dark interface, gradient accents," while the Cursor DESIGN.md in the same maintainers' awesome-design-md repo describes "a warm-cream editorial canvas (#f7f7f4) instead of the typical dark IDE atmosphere." Both cannot be right.

Tip: open the entry page and look at the tokens before you install. The summary line is the part most likely to be wrong.

5. The duply library

Our catalog, included because it is the one with a review step. 312 reviewed DESIGN.md files at duply.ai/library.

What it does:

• Publishes every entry as a live page you can inspect before adopting, for example /claude/design-md or /linear/design-md
• Carries tokens, type scale, component rules and the rationale in one file
• Validates every file against a published schema before it goes live
• Covers dashboard and product UI, not only marketing sites
• Free to browse and copy, with Pro for bulk access

Best for: people building a product rather than a landing page, where the component and state rules matter more than a hero section.

Why it makes the list: the review step is the differentiator and the honest limitation at the same time. 312 is smaller than 550+ because every file is checked rather than scraped. If you want the broadest possible index, go to a bigger catalog. If you want the file to still be right in three months, that is what the review buys.

Tip: the rationale paragraphs matter more than the hex values. They are what keeps the agent on-system when it hits a screen your file never described.

6. claudedesigner.com

The paid option, and the only commercial template shop ranking on this query.

What it does:

• Sells complete Claude Design template kits at $19.90 each, with 36 kits listed
• Each kit ships an HTML preview, JSON design tokens, CSS, a Tailwind config, Claude instructions, component docs, a setup guide and a licence, delivered as a ZIP after Stripe checkout
• Sells a ProDesign Archive at $10 described as "139 searchable professional design references in an AI-friendly Markdown archive"
• Bundles related kits, for example a five-template Social Media Feed collection at $29
• Publishes free galleries alongside: 148 visual styles and a source library of 2,073 entities covering colours, type pairings, motion, gradients and shadows

Best for: buying a finished, previewable artifact when your own design system does not exist yet and you need to ship this week.

Why it makes the list: the preview-before-you-buy model is the right one for this category, and the free galleries are genuinely usable without paying. Judge the price against the alternative honestly: one kit costs roughly what nothing else on this list costs, because everything else here is free or free-tier.

Tip: a template kit is a one-off. A DESIGN.md applies to every future artifact. If you expect more than three projects, buy the system rather than the page.

7. aitmpl.com and davila7/claude-code-templates

In the list because Google puts it in the list, and because the distinction is worth stating once.

What it does:

• Browses and installs 1,000+ pre-built Claude Code components via npx claude-code-templates@latest
• Covers agents, slash commands, MCP integrations, hooks and settings
• MIT licensed, 32,963 stars as of 29 October 2026
• Includes design-adjacent skills, for example a ui-design-system skill with token generation and component documentation

Best for: configuring Claude Code, not designing in Claude Design.

Why it makes the list: it is rank 5 on "claude design templates" and the top AI Overview citation on "free claude design templates," so anyone researching this query will land on it. It is excellent at what it does. It will not give a Claude Design artifact your brand colours.

Tip: if you are in Claude Code rather than Claude Design, the three routes comparison is the page you want instead.

8. 8B's free HTML templates

The free, properly licensed code option.

What it does:

• Publishes 20 website and business templates built for Claude Code
• All free under the MIT licence, by its own description: "This page lists 20 templates, all free under the MIT license and made by 8B, an AI website builder"
• Plain HTML, so an agent can read and modify them directly
• Sorted by what Claude Code handles well

Best for: a starting codebase when you want working markup rather than a design artifact.

Why it makes the list: MIT on all 20, with no account step. In a category full of gated downloads, that is rare enough to name.

Tip: an HTML template plus a DESIGN.md is a faster path to something that looks custom than either one alone.

How to get started

1. Decide which template you mean. Shape (built-in), style (DESIGN.md), code scaffold (8B, aitmpl) or prompt. Searching the wrong one is why this query is confusing.
2. Load a design system before you pick a template. Either /design-sync from a repo, or upload a DESIGN.md under Add assets at claude.ai/design/#org. Claude Design inherits it automatically on every new project after that.
3. Start from a file somebody checked. Browse the duply library, open the entry page, read the rationale, then download.
4. Duplicate your best project into a template. That is how the Templates shelf fills, and it is the only way to get a template that already carries your system.

The duply workflow

The template is the smallest decision here. What determines whether the output looks like your product is the design system behind it, which is why the duply library publishes 312 reviewed DESIGN.md files with a live entry page for each. What is DESIGN.md covers the format itself, give your AI agent a design system covers the part after the file exists, and Claude Code design system covers the three routes for wiring one into Claude Code specifically.

FAQ

Are Claude Design templates free?

The built-in ones are. Anthropic's help centre says Claude Design "is available on Free, Pro, Max, Team, and Enterprise plans, and it's on by default." Third-party template kits are a separate market: claudedesigner.com charges $19.90 per kit, while the DESIGN.md catalogs at duply and getdesign.md are free to browse and copy.

How do I create a template in Claude Design?

You duplicate an existing project. The empty state tells you so: "No templates yet. Create one from any project via the project menu → Duplicate." There is no template file format to import, which is why this question dominates the query.

Where can I download Claude design templates?

Three places, depending on what you want. For design systems in DESIGN.md format, duply.ai/library (312 reviewed) and getdesign.md (550+). For finished page kits, claudedesigner.com (paid, $19.90 each). For HTML starting code, 8B's 20 MIT-licensed templates.

Is there a Claude design templates GitHub repo?

VoltAgent/awesome-claude-design is the one that ranks, at 4,245 stars and MIT licensed, claiming 68 design system inspirations. Note that its repository root contains only a README and a LICENSE, and all 68 entries are links out to getdesign.md pages rather than files in the repo. VoltAgent/awesome-design-md (124,347 stars, MIT) does hold real files, 84 of them under design-md/.

What is the difference between a Claude Design template and a DESIGN.md file?

A template is a layout you start from. A DESIGN.md is a single markdown file describing tokens, type, components and the reasoning behind them, which Claude Design expands into a full design system. One template gives you one artifact. One DESIGN.md makes every future artifact consistent.

Can I use a DESIGN.md from another brand?

The catalogs exist for exactly that, and the honest framing is VoltAgent's own: entries are "curated starting points inspired by publicly observable design patterns," not official brand systems. Use one as a reference for structure and proportion, then swap the palette and type for yours. Shipping a competitor's exact visual identity is a trademark problem, not a technical one.

Why does Google show Claude Code templates when I search for Claude design templates?

Because the two names collide and the Claude Code ecosystem is much larger. aitmpl.com has 1,000+ components and its CLI repo has 32,963 stars, so it outranks anything design-specific on a keyword match. Add "DESIGN.md" or "design system" to the query and the results change completely.

Do Claude Design templates work with Claude Code?

Not directly. They are different products with different inputs. The portable piece is the DESIGN.md, which both can read, plus the SKILL.md that Claude Design emits when it builds a system from one. The three-routes comparison covers what transfers.

The short version

• For shape, free, no setup: Claude Design's built-in templates, available on every plan.
• For a reusable template of your own: duplicate a project. There is no import.
• For a reviewed design system: the duply library, 312 files with live entry pages.
• For maximum breadth: getdesign.md, 550+ entries, with npx getdesign@latest add <brand>.
• For a finished page you can buy today: claudedesigner.com, $19.90 per kit, previewable first.

Start with the system rather than the page: browse the duply library.

Related reading

• Claude Code design system: the 3 ways to wire one in
• What is a DESIGN.md file? The format, the spec, the limits
• DESIGN.md generator: the 7 real options and the catch