kalhintz/claude-design-mcp — explained in plain English
Analysis updated 2026-05-18
Generate a self-contained HTML mockup from a plain-English design brief.
Iterate on a saved design with follow-up instructions while keeping version history.
Produce several distinct design variants for the same brief at once.
Register it as an MCP server so Claude Code can create designs automatically during a session.
| kalhintz/claude-design-mcp | abdulrdeveloper/chai-aur-react | anasnakawa/kalendae-skins | |
|---|---|---|---|
| Stars | 14 | 14 | 14 |
| Language | JavaScript | JavaScript | JavaScript |
| Last pushed | — | — | 2013-12-07 |
| Maintenance | — | — | Dormant |
| Setup difficulty | easy | easy | easy |
| Complexity | 2/5 | 1/5 | 1/5 |
| Audience | developer | vibe coder | developer |
Figures from each repo's GitHub metadata at analysis time.
Requires the claude CLI already installed and authenticated, Playwright is only needed for the screenshot command.
claude-design-mcp is a small local tool that lets Claude Code generate, refine, and screenshot HTML page designs directly from the command line. The idea is to get something like a design studio experience, where you describe what you want and get back a working webpage, but running entirely on your own machine instead of through a hosted service. What makes this project notable is how it works under the hood. Instead of calling any private or undocumented Claude.ai endpoint, it simply shells out to the Claude Code command line tool that a user already has installed, using their existing subscription. There is no separate API key needed and no extra billing involved. The author is explicit that this tool does not reverse engineer Claude's hosted design feature, since that feature is powered by an internal, undocumented API that this project deliberately avoids touching. For transparency, the entire tool is a single file with zero external dependencies, and every request sent to the model, including the full prompt and system prompt, gets logged to a local file so the user can audit exactly what was sent. The tool exposes five commands. One creates a complete, self-contained HTML design from a written brief. Another iterates on a previously saved design, producing a new version while keeping track of its lineage. A third generates several different variants of a design from the same brief at once. A fourth takes a screenshot of a saved design using Playwright. The last two let a user list or read back saved designs. It can be used two ways. Directly from the terminal by running commands like creating a dashboard design or generating variants of a landing page, with no setup beyond having Node.js and the Claude CLI installed. Or it can be registered as an MCP server so that Claude Code can call these same design tools automatically during a session, which requires restarting Claude Code after registration for the server to load. Requirements are minimal: Node.js, the claude CLI available on the system path, and Playwright only if screenshots are needed. Two environment variables let a user override the paths to the claude and playwright binaries if they are not on the default path.
A local CLI and MCP tool that uses your existing Claude Code subscription to generate, iterate on, and screenshot HTML page designs.
Mainly JavaScript. The stack also includes Node.js, JavaScript, Playwright.
No license file is included, so reuse terms are unclear.
Setup difficulty is rated easy, with roughly 5min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
double-check against the repo, no cap.