Open Claude Design

Open Claude Design is now part of QualityLayer.

Create and review designs with your coding agent in QualityLayer, even without a Claude subscription.
The free, source-available Open Claude Design CLI remains available on its own.

Try QualityLayer · Install Open Claude Design

QualityLayer ·
Standalone setup ·
Examples ·
Agents ·
Reference

Design in QualityLayer

QualityLayer brings design into the same workspace as your coding agent. Create mockups, diagrams, and clickable pages from your codebase, leave comments, and ask your agent to revise them. You can work on a design on its own or use it to plan a code change.

QualityLayer's own design workspace works without a Claude subscription. Use Codex or another supported coding agent with its own account or API key. Your chosen agent's model usage is separate from QualityLayer.

For the full development workflow, QualityLayer adds plan approval before code changes, implementation in tested steps, independent AI review, and team collaboration. Explore QualityLayer on GitHub or read the artifact guide.

Connecting to Anthropic's Claude Design through Open Claude Design still requires a Claude account with access. QualityLayer's own artifacts work independently of that connection.

Quick start

Use Open Claude Design on its own

Open Claude Design connects your coding agent to Anthropic's visual design workspace. Create Claude Design files from your real components, tokens, and copy, refine them on the canvas, and sync changes back into code. It works with Claude Code, Codex, Cursor, Gemini CLI, and 70+ other coding agents.

macOS · Linux · WSL2 · No Claude Code installation or Anthropic API key required

You need macOS, Linux, or WSL2 and a Claude account with access to the workspace you want to use. The new artifact…