Skip to content

Guide

Claude Design: design systems, skills and setup for your team

By , APAC Lead & Board Member, AIREPublished

Illustrated banner reading Claude Design, with an easel, a canvas and a paintbrush in warm orange tones

Claude Design now works inside Claude itself: ask for a design in any chat, start one from the Artifacts tab, or use /design in Claude Code. It's on every plan, including Free. Design systems, which keep every design on brand, are a beta on paid plans and need to be built once from your codebase, decks or brand files. The standalone site at claude.ai/design closes on 14 December 2026, so move your design systems before then.

Where Claude Design lives now

Anthropic launched Claude Design on 17 April 2026 as a research preview at its own address, claude.ai/design. It has since moved into Claude. New designs, design systems and slide decks are now artifacts, made in the same place as everything else you do in Claude (Anthropic, 2026).

That move changed how you reach it, who gets it and how it's paid for.

Claude Design and design systems by plan, as at 5 November 2026
PlanClaude DesignDesign systems (beta)
FreeYes, on by defaultNot available
Pro, Max and UltraYes, on by defaultOn by default
TeamYes, on by defaultOn by default
EnterpriseOn by default since 15 October 2026Off until an owner turns it on

Claude Design no longer has its own allowance. Design work counts toward the same usage limits as the rest of Claude, including Claude Code, and large codebases and many rounds of changes use more. When you hit the limit, Claude Design stops until it resets, unless you have usage credits.

For what each plan costs in Australian dollars, see our Claude plans guide.

How to access Claude Design

There are 4 ways in. Pick the one that matches where the work starts.

  • In any chat. Ask Claude for a design, or choose Output, then Design, in the message box. Claude builds it beside the conversation.
  • From the Artifacts tab. Pick a Design template and start from there.
  • In Claude Code. Ask for a design, or type /design. The same command brings a design into a codebase.
  • On a phone. Ask for a design in any chat on iOS or Android and edit it there. Sharing settings still need the web or desktop app.

If you're on Team or Enterprise and can't see it

An owner controls it in Organization settings, then Artifacts. Three settings matter: Artifacts must be on, Design and Slides must be on to create new designs, and Design systems must be on to use a shared brand. On Enterprise, custom roles also need the Artifacts permissions.

What you can make

Designs, clickable prototypes and one-pagers: landing pages, dashboards, onboarding flows, forms and internal tools. You can export to PDF, PowerPoint, Google Slides, standalone HTML or a .zip, send to tools such as Canva, Miro and Wix, or hand the design to Claude Code to build. Claude Design has no version history yet, so ask Claude to save the project before a big change (Anthropic, 2026).

How to set up a Claude Design system

A design system is what stops every design looking like a generic template. Claude reads your source material once and produces a colour palette, typography, components and layout patterns. After that, Claude builds with your components and checks its output against the system before you see it (Anthropic, 2026).

On Team and Enterprise, one person sets it up and everyone's work picks it up. It's a one-off job for whoever owns the brand.

What to give Claude

You need at least one of these. More sources give a better result.

  • A codebase that holds your design system or component library.
  • A slide deck or document that reflects your visual identity.
  • Brand assets: logos, colour palettes and typography specifications.

Two ways to build it

The two ways to build a design system in Claude
From a chatFrom Claude Code
HowAsk Claude to build one from uploaded files, decks, logos, fonts, Figma files or connected apps.Run /design-sync. Claude reads your tokens and components directly.
Best forA brand system: fonts, colours and guidelines.A product system that already exists as React components.
Who usually does itThe brand or marketing lead.A developer or design engineer.

The steps

  1. Gather your sources, including real finished work such as a landing page you're proud of, not only the specifications.
  2. Ask Claude to build the design system from them, or run /design-sync in Claude Code.
  3. Review the palette, typography and components it produces. Ask Claude to fix anything that's off.
  4. Test it. Start a new design with a plain prompt such as "Create a landing page for [your product]" and compare the result with your real brand.
  5. If the first pass misses, upload more or different examples and run it again.
  6. On Team or Enterprise, have an owner share it with the organisation and set it as the default.

Larger teams can have an admin approve one standard design system and lock edits, so the brand doesn't drift as people tweak their own copies. You can keep more than one system, for example a brand system and a product system.

Why this matters more than any prompt: see why AI output looks off-brand, and how to fix it.

Claude design skills: when you need one

"Design skills" means two different things, and people search for both. Neither replaces a design system.

Your own brand skill

A skill is a folder of instructions, scripts and resources that Claude loads when a task needs it. Anthropic's own example is a company brand guidelines skill. Skills work on every plan, including Free, and need code execution switched on. A brand skill suits the rules a design system doesn't hold: tone of voice, words you never use, how to write a headline, which template suits which job (Anthropic, 2026).

Anthropic's frontend design skill

The frontend design skill is a plugin Anthropic publishes for Claude Code. It gives Claude a design process before it writes interface code: pick a clear visual direction, choose type and colour on purpose, and avoid the defaults that make a page look machine-made. Once installed, Claude uses it automatically for frontend work. It raises the floor when you have no brand to follow. When you do, your design system should win (Anthropic, 2026).

Design system, brand skill and frontend design skill compared
Design systemYour brand skillFrontend design skill
What it holdsColours, type, components and layout patterns.Written rules: voice, wording, templates, when to use what.General design judgement, no brand of its own.
Where it worksClaude Design, chats and Claude Code.Any Claude chat or Claude Code.Claude Code.
PlansPaid plans, beta.Every plan.Wherever you use Claude Code.
Use it whenYou want every design on brand without asking.You want words and choices on brand, not only visuals.You're building interfaces with no brand to follow yet.

Move your work before 14 December 2026

The standalone site at claude.ai/design closes on 14 December 2026. After that it's read-only: you can't start new projects there, chats and comments are deleted, and public project links stop working (Anthropic, 2026).

  1. Move design systems first. Open the Artifacts page in Claude and choose Move team design systems. One action moves them all. Empty systems and ones built from a starter theme don't move.
  2. Have each project owner move their projects from claude.ai/design. Owners can move everything at once; admins can't. The standalone copy becomes read-only, and that can't be undone.
  3. Save any chats and comments you need. They don't move.
  4. If your organisation has zero data retention or is set up for HIPAA, you can't move projects yet. Download them before the closing date.
  5. On Team and Enterprise, check that artifacts and design systems are on, and set a default design system.

If your organisation deletes artifacts after a retention period, a moved design system that nobody opens in that time can be deleted for good. Opening a design that uses the system doesn't count. Give the design system an owner who opens it.

What to do next

  • This week: check your plan and, on Team or Enterprise, the 3 settings under Artifacts.
  • Before 14 December: move any design systems and projects from claude.ai/design.
  • This month: build one design system from your best real work, test it, and set it as the default.

Design systems fix how work looks. Your people still need to know how to brief Claude and judge the result, which our Claude training covers.

Want your team on brand in Claude from day one? We'll help you set up the design system and train the people who use it.

Frequently asked questions

Is Claude Design free?

Yes, Claude Design is available on the Free plan as well as Pro, Max, Ultra, Team and Enterprise. Design systems, which keep designs on brand, are a beta on paid plans only. Design work counts toward the same usage limits as the rest of Claude.

How do I access Claude Design?

Ask Claude for a design in any chat, or choose Output, then Design, in the message box. You can also start from a Design template on the Artifacts tab, or type /design in Claude Code. On Team and Enterprise, an owner controls it in Organization settings under Artifacts.

What is a Claude Design system?

A set of colours, typography, components and layout patterns that Claude builds from your codebase, decks or brand files. Once it's set as the default, Claude builds new designs with it and checks its output against it before you see the result.

What is the Claude frontend design skill?

A plugin Anthropic publishes for Claude Code that gives Claude a design process before it writes interface code, so pages avoid generic defaults. Claude uses it automatically for frontend work once installed. It has no brand of its own, so a design system should take priority when you have one.

What happens to claude.ai/design?

The standalone site closes on 14 December 2026 and becomes read-only. Chats and comments are deleted and public links stop working. Move design systems from the Artifacts page in Claude, and have each project owner move their projects before then.

Sources

We read each source on the date shown beside it. Claude Design changes often, and design systems are still in beta, so check Anthropic's pages before you rely on a detail.

  1. Anthropic, Introducing Claude Design by Anthropic Labs (17 April 2026). Read 5 November 2026.
  2. Anthropic, Claude Design now stays on brand for daily work (17 June 2026, updated September 2026). Read 5 November 2026.
  3. Anthropic, Get started with Claude Design. Read 5 November 2026.
  4. Anthropic, Set up your design system in Claude Design. Read 5 November 2026.
  5. Anthropic, Move from standalone Claude Design to Claude. Read 5 November 2026.
  6. Anthropic, What are skills?. Read 5 November 2026.
  7. Anthropic, Frontend Design plugin (claude-plugins-official on GitHub). Read 5 November 2026.

All AIRE guides

Get your brand into Claude once

Book a free 30-minute call. We'll look at how your team uses Claude and help you set up a design system that keeps every piece of work on brand.

No obligation and no sales pitch.