About six months ago, I published an article.
The main point of that article was that “after Vibe Coding, the next wave seems to be Vibe Design” and that “more and more people are starting to ask whether AI can handle design work as well.” This article is a follow-up to that one—and now it’s starting to feel like this idea may actually become a reality.
Earlier today, Anthropic made a press announcement.
https://x.com/claudeai/status/2045156271251218897
In short, they announced “a new tool that lets you create designs and other visuals just by talking with Claude—even if you don’t have professional design expertise.”
Google had been drawing a lot of attention in the Vibe Design space with all the buzz around DESIGN.md, so people had already been speculating that Anthropic might be getting ready to reveal something too.
- Claude Design
-
What can it do?
- Create interactive prototypes
- Generate pitch decks and presentation materials
- Produce landing pages and marketing assets
- Automatically apply your team’s brand and design system
-
How does it work?
- Start from text, a file (DOCX/PPTX, etc.), or a URL
- Refine through conversation, inline comments, and direct editing
- Export to Canva, PDF, PPTX, or HTML
- Hand it off directly to Claude Code for implementation
In true Vibe Design fashion, you can even “send it straight to Claude Code for implementation.” But one of the most interesting points here may be how easily it integrates with native visual tools like Canva.
Trying it out
You can access it here.
It’s available to Pro, Max, Team, and Enterprise users.
(For convenience, I’m using screenshots translated into Japanese.)
As expected, it seems to be built around the idea of setting up a design system first.
Let’s go ahead and try editing the design system.
This part feels very Vibe Design-like: you can build a design system using natural language.
At the same time, it also supports existing design assets—you can provide things like a GitHub repository or a Figma .fig file as input.
For now, I decided to build one from natural language instead (I used my Zenn profile as the input).
Oh wow... it looks like it’s going to build something pretty substantial. Promising. Let’s wait and see.
(Just make sure not to forget to click the Generate button!)
Now we wait. Progress is shown on the left side.
Since the whole thing is constructed through natural language, it really does feel like Vibe Design in action.
It even looks like it generates a SKILL.md file at the end.
Done!
Using the design system
When you go back to the Home screen, the design system you created is now available to use, so let’s try it out.
Enter a project name and click the Create button.
This time, I’ll make a wireframe.
Let’s try creating a search screen.
My sketch is embarrassingly rough, but hopefully that won’t be a problem!
(It seems the sketch is included as part of the context.)
Along the way, it asks for clarification on anything ambiguous.
Finished!
Wow—even with such a rough sketch, it interpreted everything surprisingly well.
Sending it to Claude Code
Open Claude Code and paste the command into the prompt.
One thing to note: the URL included in this command has an expiration time.
If it expires, just repeat the same steps to get a new URL.
Now we wait.
Done!
It properly read the project contents and generated it as a JSX file.
Final thoughts
What I like most about this is how much more smoothly it connects to AI coding compared with Figma.
That alone feels like a strong enough reason to adopt Claude Design early.
Top comments (0)