← ClaudeAtlas

claude-designlisted

Use when the user wants to build or prototype something visual with Claude Design — Anthropic's claude.ai/design tool — and needs a strong prompt or spec: a prototype, dashboard, slide deck, landing page, marketing page, or internal-tool UI. Covers both writing a paste-ready design brief to build in the browser and driving Claude Design from Claude Code (the /design and /design-sync commands and the Claude Design MCP server). Do NOT use for building the UI yourself in the repo (that is frontend-design's light path), backend/API/data-model work, or generic Claude API / chat prompt engineering.
jasonm4130/claude-skills · ★ 2 · AI & Automation · score 68
Install: claude install-skill jasonm4130/claude-skills
# Claude Design **Claude Design** (Anthropic Labs, `claude.ai/design`) turns a prompt plus real assets into a self-contained, live artifact — a prototype, dashboard, slide deck, landing page, or internal-tool UI — that you refine in the browser or drive from Claude Code. Beta on Pro/Max/Team/Enterprise (Opus 4.7; web + desktop, not mobile) — on Enterprise an admin must enable it first under Organization Settings → Capabilities → Anthropic Labs. **Core principle:** a great first prompt names the **goal, layout, content, and audience**, hands over your *real* assets, then iterates through the right channel. Don't one-shot the whole thing in one giant prompt — start specific, then layer. ## Two ways to run it - **In the browser** (`claude.ai/design`) — paste a brief, then iterate on the canvas. - **From Claude Code** (the terminal) — use `/design` to create, edit, and sync design projects without leaving the terminal, then hand a finished design off to build. Same brief discipline either way: the prompt you give `/design` *is* the brief. ## The brief — the thing worth getting right Fill every field you can from what's known (codebase, conversation, brand); leave the rest as an explicit placeholder rather than inventing detail. Emit exactly this: ```markdown # Claude Design brief: <what you're building> **Goal** — the artifact + the one job it does: … **Audience** — who uses it, where, and what they care about most: … **Layout / screens** — named screens or sections, how