npx -y @12ui/design{
"mcpServers": {
"12ui-design": {
"command": "npx",
"args": [
"-y",
"@12ui/design"
]
}
}
}@12ui/design is a community MCP server that connects AI assistants like Claude to the canonical 12ui cli, sdk, mcp server, and visual interface design skills. It runs locally on your machine, keeping your data private and giving you full control over the connection. Adding it to your setup expands what Claude can do without any extra coding.
About @12ui/design
Overview
The canonical 12ui CLI, SDK, MCP server, and visual interface design skills
Links
Topics
mcp, mcp-server, design, just-every, image-to-html, image-to-react, image-to-app, layered-document, design-corpus, visual-retrieval
Who Should Use @12ui/design?
- 1Analyse and describe images as part of your AI workflow
- 2Extract and summarise content from PDFs and documents
- 3Extend Claude and other AI assistants with new capabilities
- 4Automate tasks that previously required manual steps
How to Install @12ui/design
Before you start
You will need Node.js (v18 or later) installed on your machine — download it from nodejs.org if you haven't already.
- 1Open a terminal (Terminal on Mac, Command Prompt or PowerShell on Windows).
- 2Paste the install command above and press Enter — Node.js will download and run the server automatically.
- 3Add the server to your Claude Desktop config file (see the JSON snippet above) and restart Claude.
The Claude Desktop config snippet above can be copied and pasted directly into your claude_desktop_config.json file — no editing required.