Claude Code's New /design Skill Puts Claude Design's Artboards in Your Terminal
Anthropic's new Claude Code design skill brings Claude Design's artboard workflow into the CLI, so you pick a UI option and have Claude build it directly.
Run /design in Claude Code now and you get a row of editable artboards, not a paragraph describing a layout. That is the whole pitch behind the new Claude Code design skill Anthropic's developer account shipped on August 17: a research preview that pulls Claude Design's artboard workflow out of the browser and into the CLI and desktop app, built on top of artifacts. Pick an option, tweak it, and Claude implements it, all without leaving the terminal session that was already running the code.
Why this shows up now
Claude Design launched as its own standalone product on April 17, 2026, aimed at people without a design background, founders and product managers who wanted to describe a layout in plain language and get a working prototype back. It landed hard enough that Figma's stock dropped roughly 7% the same day, and Anthropic's chief product officer, Mike Krieger, had resigned from Figma's board three days earlier. The signal was clear: Anthropic wasn't planning to partner with the tools designers already used, it was planning to replace the round trip between them.
Folding that same artboard workflow into Claude Code closes the other half of that loop. Before this, a developer working in the CLI who wanted visual options had to open Claude.ai, generate a prototype there, then somehow get the result back into the codebase. The Claude Code design skill removes that context switch. The workflow now lives in the same window as the terminal that will eventually ship the code.
What running /design does
The mechanics are simple by design. Typing /design inside a Claude Code session generates a small set of UI options as artboards, editable canvases rendered through artifacts rather than static images or text descriptions. You look at the options, pick the one closest to what you want, make direct edits or ask for changes, and then hand it to Claude to turn into real code. It is the same pick-tweak-implement loop Claude Design uses on its own, just running one layer closer to where the code actually lives.
Anthropic's own framing is that a prototype started in Claude Design can be packaged into a handoff bundle and passed straight to Claude Code for implementation. For a workflow that used to require exporting screenshots or re-describing a UI from scratch in a second tool, that handoff is the actual feature, not the artboards themselves.
Access follows the same tiers as the rest of Claude Code: Pro, Max, Team, and Enterprise plans can use it today.
Where this leaves the community skills that filled the gap
The gap between "Claude Code can write UI code" and "Claude Code can show you design options first" has been open long enough that a small ecosystem grew up around it. baoyu-design, covered on this site earlier this month, packages Anthropic's own Claude Design methodology as a portable Agent Skill so that Claude Code, Cursor, and roughly 70 other file-capable agents can produce clickable HTML mockups without waiting for Anthropic to ship a native version. Other developers built similar wrappers around the same idea; a GitHub search for Claude's internal design system prompt turns up more than one open-source attempt to recreate exactly what shipped today as an official feature.
That does not make baoyu-design and its peers pointless. A third-party Agent Skill still works across whichever tool you're actually using, Cursor included, while the native /design skill is Claude Code and Claude Desktop only. But for anyone using Claude Code specifically, the practical reason to reach for a community skill just got smaller: the workflow those skills were approximating now ships in the box.
What "research preview" actually means here
Anthropic is labeling this a research preview, which is worth taking at face value rather than as a formality. There is no independent benchmark yet on how well the artboard-to-implementation handoff holds up on a real, messy codebase versus a clean demo, and no track record on how consistently the generated code matches what the artboard showed. The launch tweet itself carries no external verification, only Anthropic's own framing, so the honest read is that this is early: worth testing on a low-stakes UI task before trusting it with anything customer-facing.
The practical takeaway
For an operator already living inside Claude Code, the Claude Code design skill is worth a five-minute test run the next time a small UI decision comes up, a landing page section, a settings panel, a form layout. Run /design, look at what comes back, and judge it against the same bar you'd apply to any other AI-generated first draft: useful starting point, not a finished decision. The bigger shift is structural rather than cosmetic. Design and implementation used to live in separate tools with a manual handoff between them. Now they sit in the same session, and the round trip that used to cost a context switch costs a slash command instead.
Sources: ClaudeDevs on X; TechCrunch, "Anthropic launches Claude Design, a new product for creating quick visuals"; VentureBeat, "Anthropic just launched Claude Design".
Join the newsletter
AI workflows and systems, straight to your inbox.
No spam. Unsubscribe anytime.