Claude Design Is Not a Design Systems Tool. That's Okay.
A design systems practitioner's honest read on what it is, what it isn't, and where Figma actually sits in this picture.
Claude Design has been out for a few days, and I spent the better part of three or four hours testing it against the kind of work I actually do. Not generic landing pages. Not pitch decks. Design systems work.
I uploaded two design systems. The first was Altitude, our internal system with a comprehensive Figma file and a coded component library on GitHub. The second was CollegeTown, the system we use for higher-ed demos. Both are (mostly) AI-ready. Variables, component sets, attributes, the whole picture.
Then I asked Claude Design to do real things with them. Generate banners. Generate buttons. Generate dashboards for inventory management and student success. Sketch some flows and bring them to life.
Here’s where I landed.
First, give it credit
Some of this is genuinely impressive.
The slides feature is nice. The wireframing is solid. The draw and annotate features, where you can sketch on the canvas and have Claude turn it into something real, are useful. Same for the inline annotations where you can spot-check specific areas.
I asked it to generate a date and time range picker for Altitude. Altitude doesn’t actually have one of those components. It has the tokens. Spacing, typography, colors, radii. From those tokens alone, Claude Design produced a clean, on-brand picker with quick ranges, dual calendar view, time inputs, and a timezone selector.
That’s the kind of thing where I had to stop and admit it: this is doing real work. Synthesizing a complex composition from token primitives is hard, and it nailed it.
For landing pages, marketing collateral, embeddable interactive elements, exploratory prototyping, and the stuff you’d otherwise reach for Lovable or Replit to build, this is a great tool.
So I want to be clear before I get into the rest of this: I’m not here to dunk on Claude Design. There’s a LOT to like.
This isn't a Figma killer, and I don't think it's trying to be.
Where it breaks for design systems work
The pitch is that Claude Design reads your codebase and your Figma file at onboarding and applies your design system to every project. That’s the promise that pulled me in.
In practice, it doesn’t really work that way.
I asked it to generate an Altitude banner. Altitude has a banner component. Five layouts, four variants, eight content compositions per variant, three button styles, full state coverage. It’s well-defined in code as <ALBanner> and it’s well-defined in Figma. Claude Design had both.
It still went off and generated its own banner.
I asked it to generate a button spec sheet. The buttons looked great. Variants, states, sizes, semantic tokens. The output reads like someone who knows the system. But it also did a lot of stuff I didn’t ask for.
When you move up to a complex composition, the cracks really show. I had Claude Design generate a Student Success Dashboard for the CollegeTown system. The output looked decent at a glance. Then I opened the JSX.
It’s not importing my Button component. It’s not importing my Card component. It’s writing inline <button> tags with style props.
This is the gap. Claude Design can read a design system carefully when the prompt is about the system. When the prompt is about a composition that uses the system, it stops respecting the components and just generates lookalikes.
The draw feature is a good example, and it’s a feature I genuinely like. I sketched out an Editor’s Picks layout. Three rough card outlines, header bar at the top, a chart shape in the middle, a footer block. Then I asked Claude Design to render it using CollegeTown.
The translation of the sketch is faithful. Image area at the top, GPA stats and trend lines in the middle, action buttons at the bottom. That part is impressive.
The aesthetic is the problem. Purple-to-blue gradient cards. Giant initials as background watermarks. That’s not CollegeTown. That’s Claude Design’s house style. Even with a sketch as the starting point and explicit instructions to use a specific design system, it still reached for its own visual vocabulary.
This is the pattern I kept seeing across every test.
Structure, faithful. System aesthetic, drifting.
For a design systems team, this is the whole game. A canonical design system exists so that every product surface stays in sync, components ship from one source, and updates propagate. If the AI tool generating from your system is just guessing at lookalikes, it isn’t actually consuming your system. It’s referencing it.
The Design Systems feature is closer to brand guidelines
Claude Design has a “Design Systems” tab. You can build a little design system inside it. Colors, typography, components. It’s nice.
It’s nowhere near robust enough to replace an enterprise design system. It feels more like setting up brand guidelines than maintaining a multi-themed component library with a hundred-plus components and a token architecture that spans multiple themes.
The fact that it asks you to connect a Figma file and a code repo to do its best work is the giveaway. This tool isn’t trying to be your canonical source. It’s trying to read your canonical source and produce visual work that resembles it.
That’s a different job. It’s a fine job. But it isn’t design system management.
The cost question, and the collaboration question underneath it
A lot of the early hot takes have framed this as a Figma killer on cost. Replace your designers, slash your tooling spend.
I’m skeptical. Token consumption on Claude Design adds up fast. Three or four hours of meaningful tinkering and you can feel it. Now imagine twenty people on a design and engineering team, all spinning up prototypes and burning tokens through the day, and try to do that math against per-seat Figma pricing. Even with cheaper models down the road, I have a hard time seeing the ROI on a tool that, at the end of the day, isn’t generating shippable code that a design system can actually support.
But I think the cost frame is the wrong frame anyway. The bigger issue is collaboration.
Figma is collaborative by default. Multiplayer is the whole point. Claude Design is single-player by default with sharing bolted on. If teams adopt it widely, they end up isolated in their own little worlds, generating prototypes that aren’t anchored to a shared source of truth, and then trying to merge those efforts back together later. That’s a workflow regression for any team operating at scale.
Figma has actually been busy
A lot of the takes I’ve been seeing assume Figma hasn’t made a move yet. That isn’t true.
→ Code Connect maps Figma components to actual code components in your repo (React, React Native, GitHub, Storybook). When AI handles a component in Figma, it looks for a Code Connect mapping before generating code.
→ The Figma MCP server is being used in the wild with Claude Code, Cursor, VS Code, etc... This is the real design-to-code (or code-to-design?) pipeline, and it’s grounded in Figma as the source of truth.
→ Make kits bring real components, data, and constraints into Figma Make so prototypes start from your system rather than from a blank canvas.
This is what design-systems-aware AI generation actually looks like, and it’s already happening. It’s just happening with Figma in the center instead of off to the side.
The workflow Claude Design is pointing at already exists
Here’s the part that ties this together for me.
The pitch for Claude Design’s workflow is roughly: I have a design system, I want to generate new product surfaces from it, and I want AI to do most of the lift.
That workflow exists today. You can pair Figma with an MCP server like our Figma Console MCP, or with Figma’s own MCP server, or with Code Connect, and then point an AI app generator at it. Lovable, v0, Replit, Figma Make, Claude Code working inside your repo. Your Figma file stays the canonical source. Your codebase stays the production surface. AI does the generation in between.
That flow is more linear, more honest about where source of truth lives, and it produces output that actually uses your component library, because the AI is operating inside the repo where the components live.
Claude Design is gesturing at this same workflow. It just hasn’t done the connection work yet. The components are referenced, not consumed.
So what is Claude Design, then?
After three or four hours, here’s where I land.
Claude Design is a really good prototype generator with design-system-aware aesthetics. Not design-system-faithful execution. Those are different things, and the difference matters most for the people Anthropic put on the front of the marketing: design teams.
For a founder sketching a feature, a marketer building a landing page, a PM exploring a flow, an engineer prototyping an embeddable widget, this is a fun and capable tool. The slides are nice. The sketch tools are great. The design token-based composition synthesis is impressive. The collaboration story is light, but for solo work or small teams in early exploration, that’s fine.
For a design systems practitioner trying to incorporate this into a production workflow, I don’t see the fit. Not yet. The fidelity isn’t there, the components aren’t actually being consumed, and the “Design Systems” tab is doing a different job than its name implies.
Anthropic seems to know this. The tab exists to help you set the look and feel for what you’re about to ask Claude to build. The expectation is that the real system lives elsewhere. I don’t think this tool is trying to manage your design system. I think it’s trying to make sure the prototypes it generates feel like they belong to your brand.
That’s a useful job. It’s just not the job the early hot takes are claiming it is.
Where I’m landing
Designers aren’t cooked.
Figma isn’t dead.
Claude Design isn’t a Figma killer, and I don’t think it’s trying to be. It’s a different tool, pointing at a different problem, and most of the loud takes claiming otherwise haven’t actually used it for design systems work.
For me, this is a fun sandbox and a great prototype generator. I’ll keep using it for landing pages, embeddables, exploratory work, and quick decks. I won’t be reaching for it inside our design systems engagements. There are better tools for that, including ones we’ve been building, and ones Figma has been quietly cooking for over a year.
Maybe a future version of Claude Design closes the gap. Maybe it learns to actually consume the components it’s been given instead of just referencing them. If it gets there (and I’m sure it will), the conversation changes.
It's a great tool. It just isn't what the top tab says it is.
Until then, that's where I land.