Claude Design
Anthropic
What Claude Design is
Claude Design is a tool from Anthropic that lets you build designs, prototypes, slides and marketing material with Claude instead of in a traditional design tool. Put simply, it is a design tool that gets you to good-looking web pages and presentations very quickly without being a designer yourself.
How it works
It is straightforward: you describe what you want in text, and Claude gives you a design you can iterate on. The workspace is split in two: chat on the left, canvas on the right. In the chat you describe what you want to make and Claude produces a first version. From there you adjust in three ways:
- Chat for structural changes ("add a pricing section", "change the tone").
- Comments directly on elements in the canvas for small, precise fixes ("set the spacing to 8px"). You can also draw circles and add arrow notes.
- Auto-generated sliders for spacing, colors and layout when Claude decides they make sense.
Build a design system (brand template)
You can upload fonts, logos and other assets manually, upload a Figma file, connect a GitHub repo or a local code folder to pull in detailed designs. Claude reads this once (usually around five minutes for larger sources) and builds an editable library of design elements. When you later start a new prototype or presentation, you pick the design system you want to use. Skip this step and you get generic "AI designs" that look like everything else made with the tool.
Export and handoff
Designs can be shared as a URL, downloaded as a ZIP, or exported to PDF, PowerPoint, standalone HTML, Gamma or Canva.
If you are working on a prototype, the tool can pass the design on to Claude Code. That is a much better way to iterate on the design than starting in Claude Code directly.
What works well
- Design system import that actually works, and that you can reuse when new prototypes and presentations come along
- Prototype landing pages with the right brand design (hero, value props, CTA, pricing section)
- Good-looking presentations from existing content (PDFs, articles, text) with interactive elements
- Creative "off-brand" design when you drop the design system and describe a reference style instead
- The variants and tweaks flow: get three parallel designs to choose between, and swap styles, fonts and sizes without re-prompting
What could be better
- Without a design system or reference images the result is generic "Claude Design"
- Every change beyond small slider adjustments needs a prompt and a wait, which can take five to ten minutes for larger changes
- PowerPoint export works, but what you get is not identical to what you see on the web (close enough, though)
- Exporting presentations to Canva is not great. In practice it works better to export to PowerPoint first and then into Canva
Claude Design is still in beta, so expect some bugs. It is still well worth testing out and getting familiar with.
How to use it
- Go to claude.ai/design (you need a Pro, Max, Team or Enterprise account).
- Set up your design system first. Connect a GitHub repo, drop in a local code folder, or upload a Figma file, logo and colors. Without it the output looks like every other Claude Design project.
- Choose the project type: prototype, slide deck or one of the others
- Describe what you want to make in the chat panel, and be specific about the goal, layout, content and audience.
- Claude asks follow-up questions if something is missing
- Once the first version is on the canvas: use comments, edit or draw on specific elements for small fixes, and chat for bigger changes. Ask for two or three variants if you are unsure about the direction.
- Export to PDF, PPTX, Canva or HTML when you are done (HTML works best today), or click "send to Claude Code" to go straight into development
Features
Prototyping and slide decks
Claude Design has separate project types for designing prototypes such as websites, and for presentations.
Editable presentations
Presentations built in Claude Design can be edited directly in the tool, for example to change the text.
Design templates
Builds consistent design systems that get reused across the projects and presentations you make.
Variants and tweaks
Get 1, 3 or 5 parallel variants of the same design to compare. After the first generation you get a tweaks panel where you can swap specific choices (font, background color and so on) without writing a new prompt.
Iterative editing
Use chat, comments or the drawing tool to edit and improve the design.
Video (animations)
Make "videos" in the form of simple animations, for example demo clips of how an interface should behave.
Export options
PDF, PPTX, standalone HTML, ZIP folder, transfer to Canva or Gamma, and shareable links
Handoff to Claude Code
One-click handoff that packages the design as instructions and components for Claude Code to implement directly.
Tips for good use
- Spend a bit of time on the design system setup before you start the first project. The results look less AI-generated and closer to the brand design you want, and you avoid explaining colors and components every time.
- Don't iterate on text content inside Claude Design. Let the tool write the first draft, but go back to regular Claude to polish the copy. Text iterations burn just as many tokens as design iterations, and the weekly quota empties fast.
- Use comments for small fixes and chat for bigger changes. Comment directly on the element you want to adjust ("16px padding here", "switch to the secondary color"). Save the chat for when you need a new section or a change of direction.
- Ask for two or three variants when you are unsure. Comparing is faster than guessing, and you save iteration rounds. Then use the tweaks panel to swap specific choices (headline, layout, CTA) without a new prompt.
- Upload one or two reference screenshots of something whose style you like. Without references the "Claude Design" look is obvious and not very distinctive. A good reference changes the output drastically.
- Don't use Claude Design for logos or illustrations. It isn't built for graphic design, so stick to UI, layout, slides and landing pages. Make the logo somewhere else and upload it.
- Finish in Claude Code once the design is good enough, rather than perfecting it in Design. The handoff packages the design and components as input for Claude Code in one click, and polishing in code is easier than spending more iterations on the canvas.
- Use it for slides when you already have the content. Upload a PDF, an article or meeting notes and ask for "a deck based on this, matching the brand". This is one of its strongest uses, particularly for training, onboarding and client material. Much better than starting blank and iterating.
Available on
Links and pricing
Included in Claude Pro, Max, Team and Enterprise as a beta. Uses your ordinary quota.
AI is an assistant, not an authority. Always verify what matters.
YNSPIRA