M
marvkr/better-design
Design system and shadcn/ui registry for MCP clients
View on GitHub ↗Link checked 2026-11-12 · HTTP 200 · opens the vendor's own site
Install & config
Client config (built from the install command this repo gives)
{
"mcpServers": {
"marvkr-better-design": {
"command": "npx",
"args": ["skills"]
}
}
}Parsed from the README we fetched on 2026-11-04; we have not executed it.
command/args come from the install command the repository states. When it is ambiguous, the project README wins.
VS Code (.vscode/mcp.json - the key is servers)
{
"servers": {
"marvkr-better-design": {
"command": "npx",
"args": ["skills"]
}
}
}Same server, but VS Code keeps it under <code>servers</code>.
Claude Code (command line)
claude mcp add --transport stdio marvkr-better-design -- npx skills
Claude Code does not read a config file; add the server with this command.
Key names differ by client: Clients & CLI
- Source
- collected from the abordage/awesome-mcp list · type: MCP server
- Harvest history
- first seen 2026-11-05 · last seen 2026-11-14 · seen 10× · listed by 10 sources
- Score
- score 1,003 · 10 sources · mcp
- Install
npx skills
FAQ (answers come from our records)
How do I install it?
The repository provides this install command:
npx skills. It comes from the repository itself; we cannot guarantee it runs as-is in your client.Who is it for?
We filed it under these tags: MCP 服务. The tags come from the entry itself, not a taxonomy we imposed.
Who maintains it?
first catalogued 2026-11-05；last seen 2026-11-14。There is no official certification or quality rating here — we record sources and dates only.
# Better Design
以下摘录自该仓库的 README（片段） · 在 GitHub 读完整 README →
Give your coding agent design systems, UI and UX guidance, icons, and code reviews through MCP.
Works with Codex, Claude Code, Cursor, VS Code, Devin, Antigravity, and other MCP clients.
Website · Docs · Design systems · Installation guide
## Install
Run these commands in your project:
bash
npx skills add marvkr/better-design --skill better-design
npx better-design
The first installs the agent skill. The second connects Better Design to your coding tools and keeps your existing configuration. Restart your agent after setup.
If you have no account, setup creates a free key for you. If something does not work, run npx better-design doctor. It prints the command that fixes each problem.
## What it does
When your agent builds UI, Better Design gives it what it usually misses:
| Tool | What your agent gets |
| find-design-system | A design system that fits the product you describe |
| get-design-system-kit | That system's tokens and component code, ready to install |
| get-ui-principle | Guidance on hierarchy, spacing, typography, depth, motion and more |
| get-ux-principle | Guidance on flows, forms, navigation, errors and onboarding |
| find-icons | Icons from one library, so the style stays consistent |
| get-review-rules | Accessibility and visual-design checks to fix its own work |
To check UI code yourself, run npx better-design review in your project.
## Try it
Ask your agent:
> Use Better Design to build a settings page with my project's design system, then review it for accessibility and consistency.
## Install a design system with shadcn
Every design system is also a shadcn registry. Browse them at better-design.com/design-systems, then install one component:
bash
npx shadcn@latest add https://better-design.com/registry/ / .json
For example, the Cashmere button:
bash
npx shadcn@latest add https://better-design.com/registry/cashmere/button.json
Or the full Cashmere theme and components:
bash
npx shadcn@latest add https://better-design.com/registry/cashmere/all.json
## This repository
This repository holds the agent skill in skills/better-design, and component and registry sources in components/ and registry/.
Works with Codex, Claude Code, Cursor, VS Code, Devin, Antigravity, and other MCP clients.
Website · Docs · Design systems · Installation guide
## Install
Run these commands in your project:
bash
npx skills add marvkr/better-design --skill better-design
npx better-design
The first installs the agent skill. The second connects Better Design to your coding tools and keeps your existing configuration. Restart your agent after setup.
If you have no account, setup creates a free key for you. If something does not work, run npx better-design doctor. It prints the command that fixes each problem.
## What it does
When your agent builds UI, Better Design gives it what it usually misses:
| Tool | What your agent gets |
| find-design-system | A design system that fits the product you describe |
| get-design-system-kit | That system's tokens and component code, ready to install |
| get-ui-principle | Guidance on hierarchy, spacing, typography, depth, motion and more |
| get-ux-principle | Guidance on flows, forms, navigation, errors and onboarding |
| find-icons | Icons from one library, so the style stays consistent |
| get-review-rules | Accessibility and visual-design checks to fix its own work |
To check UI code yourself, run npx better-design review in your project.
## Try it
Ask your agent:
> Use Better Design to build a settings page with my project's design system, then review it for accessibility and consistency.
## Install a design system with shadcn
Every design system is also a shadcn registry. Browse them at better-design.com/design-systems, then install one component:
bash
npx shadcn@latest add https://better-design.com/registry/ / .json
For example, the Cashmere button:
bash
npx shadcn@latest add https://better-design.com/registry/cashmere/button.json
Or the full Cashmere theme and components:
bash
npx shadcn@latest add https://better-design.com/registry/cashmere/all.json
## This repository
This repository holds the agent skill in skills/better-design, and component and registry sources in components/ and registry/.
Listed badge (optional)
Copy this line into the README if you want the listing mark. Optional, and it does not affect being listed.
[](https://anclum.com/en/s/marvkr-better-design/)
- Source
- awesome · https://github.com/marvkr/better-design
- Browse by field
- MCP servers
- Listed by
- 10 independent sources
- added
- today
More like this
Filed under
Every tag opens the full list for that filter. Counts are the live catalogue figures.