Anthropic Adds /design Command to Claude Code for Terminal UI Mockups

Anthropic has expanded Claude Code with a new /design command that lets developers create, iterate, and view UI mockups without leaving the terminal.

UI Prototyping Directly in the Terminal

Instead of hopping between Figma and a shell, you can now type something like /design a few options for a login screen. Claude replies with several interactive “artboards” that display high-fidelity mockups. You compare layouts, pick a favorite, and refine the look by asking follow-up questions—all before writing a single line of production code.

Context-Aware Mockups from Your Codebase

Developer Nate Parrott notes that Claude actually reads the current repository. It pulls colour palettes, component libraries, and layout conventions, then tailors each design to match the project’s existing style. The results appear as “Artifacts,” a dedicated view inside Claude that shows the images without opening a separate graphics editor. At this stage the mockups exist only in Claude’s workspace; you must explicitly save them to the file system before turning them into code.

Why It Matters for AI-Assisted Development

The command collapses two stages of the software development life cycle—design and coding—into one. Teams that prize speed can generate multiple layout options with a single prompt, accelerating early-stage discovery. Because Claude uses the live codebase, the mockups stay on-brand and compatible with the component system, cutting the manual cleanup that follows generic image generation.

Anthropic frames this as a step toward an “AI software engineer” that handles both logic and aesthetics. If the terminal can serve as a multi-modal workspace, the line between writing code and shaping the user experience thins dramatically.

Current Limitations

The feature is still in preview. Generated mockups do not become source files automatically; you must export and integrate them yourself. That extra step can eat into the time savings, especially on larger projects with dozens of components.

How to Try It

Run claude update to pull the latest preview build and enable the /design command.

Key Takeaways

  • Integrated Prototyping: /design generates multiple UI artboards directly from terminal prompts.
  • Contextual Consistency: Claude scans the current codebase to keep mockups aligned with the existing design system.
  • Streamlined Workflow: By merging Claude Design’s prompting power with Claude Code’s execution, developers move from concept to visual prototype without switching tools.

Anthropic’s new /design command lets developers create and iterate UI mockups straight from the terminal, cutting the back-and-forth between design tools and code editors—a bottleneck many fast-moving teams still wrestle with.

Generating Visual Drafts from a CLI Prompt

You type a command like /design a few options for a login screen and Claude returns a set of interactive artboards. Each artboard shows a high-fidelity mockup that you can inspect, compare, and refine by asking follow-up questions.

Claude reads the files in the current project, extracts colour palettes, component libraries, and layout conventions, then tailors the designs to match. The output appears as “Artifacts,” a view that displays the images without opening a separate graphic editor. At this point the mockups live only in Claude’s workspace; you must explicitly save them to the file system before turning them into code.

Why Developers Care About a Design-in-the-Terminal Tool

Most developers spend a large chunk of their day swapping between a code terminal and a UI design app. Bringing visual prototyping into the same window where code is written collapses two stages of the software development life cycle into one.

For speed-focused teams, generating several layout options with a single prompt can accelerate the early-stage discovery phase. Claude’s read of the existing codebase keeps the mockups on-brand and compatible with the project’s component system, reducing the manual cleanup that typically follows a generic image-generation step.

Anthropic frames the addition as a step toward an “AI software engineer” that can handle both logic and aesthetics. If the terminal can now serve as a multi-modal workspace, the line between writing code and shaping the user experience becomes thinner.

Limitations and the Case for Traditional Design Tools

The feature is still in preview, and several practical constraints remain. First, the generated mockups do not automatically become source files; developers must export and integrate them manually. That extra step can erode the time savings for larger projects where dozens of components need to be synced.

What to Watch as the Feature Matures

Anthropic’s update notes that the command can be enabled with a simple claude update.

Takeaway: Embedding a design prompt inside Claude Code’s terminal gives developers a shortcut from concept to visual prototype, but the workflow still depends on manual hand-off and lacks the depth of dedicated UI tools. Its evolution will decide whether the command remains a niche convenience or becomes a core part of an AI-driven development stack.