Is Better Design safe to use?

Better Design has no known CVEs as of the latest MCPpedia security scan. It does not require authentication, so any local process can connect — keep this in mind in shared environments. Licensed under MIT.

How do I install Better Design?

Better Design supports copy-paste install configs on its MCPpedia page for Claude Desktop, Cursor, and Claude Code. Scroll to the Quick Install section and select your client.

What can Better Design do?

Better Design provides 2 tools: Setup, Contributing. See the full tools list on the server page for descriptions and parameters.

What AI clients work with Better Design?

Better Design is compatible with claude-desktop, cursor, claude-code. It uses stdio and sse and http transport.

Is Better Design actively maintained?

Better Design is actively maintained — last commit was 11 days ago. It has 157 GitHub stars.

Better Design

Name: Better Design
Author: marvkr

by marvkr

🎨 Open-source design MCP server + shadcn/ui registry — AI design systems for Claude Code, Cursor, Codex, GitHub Copilot & any MCP client. 31 brand-grade themes (Linear, Stripe, Vercel, Notion, Apple, Supabase, Figma…) + design tokens, UI principles & WCAG rules. Install any component with one command.

157 2 tools GitHub

No known CVEs

MIT license

Actively maintained

Last commit 11d ago

Works with most clients

Transport: stdio, sse, http

2 tools · ~51 tok

Grade A · 0.0% of 200K ctx

Edit this pageView history

Design

Step 1

Install in your client

Config is the same across clients — only the file and path differ.

Supported in Claude Desktopstdio, sse, http · Node 18+

Paste into ~/Library/Application Support/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "better-design": {
      "args": [
        "/absolute/path/to/better-design/packages/mcp/dist/index.js"
      ],
      "command": "node"
    }
  }
}

Are you the author?

Add this badge to your README to show your security score and help users find safe servers.

Embed in your READMEAbout badges →

[![MCPpedia Score](https://mcppedia.org/api/badge/better-design)](https://mcppedia.org/s/better-design)

Read me

What Better Design does

Turn your AI coding IDE into a design engineer. Better Design works with MCP-compatible agents and editors like Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop, and claude.ai. It is a design MCP server, AI design-system registry, and UI review layer for generating polished product interfaces from prompts.

Test This Server

This server supports HTTP transport. Be the first to test it — help the community know if it works.

Loading README…

Scored, not listed

Why this score

Five weighted categories — click any category to see the underlying evidence.

Score breakdown

74/100across 5 weighted dimensions

How we score →

0255075100

−26

Security

Maintenance

Efficiency

Documentation

Compatibility

Categoriesclick a row to see evidence

Security

OSV.dev

No known CVEs.

No package registry to scan.

Inventory

Tools (2)

Click any tool to inspect its schema.

~51 tokens total

Community

Reviews

Be the first to review

Have you used this server?

Share your experience — it helps other developers decide.

How easy was setup?Did it work reliably?How was the documentation?

Frequently Asked Questions

Is Better Design safe to use?: Better Design has no known CVEs as of the latest MCPpedia security scan. It does not require authentication, so any local process can connect — keep this in mind in shared environments. Licensed under MIT.
How do I install Better Design?: Better Design supports copy-paste install configs on its MCPpedia page for Claude Desktop, Cursor, and Claude Code. Scroll to the Quick Install section and select your client.
What can Better Design do?: Better Design provides 2 tools: Setup, Contributing. See the full tools list on the server page for descriptions and parameters.
What AI clients work with Better Design?: Better Design is compatible with claude-desktop, cursor, claude-code. It uses stdio and sse and http transport.
Is Better Design actively maintained?: Better Design is actively maintained — last commit was 11 days ago. It has 157 GitHub stars.

Similar servers

Others in design

View all →

Figma Console Mcp96

MCP server for accessing Figma plugin console logs and screenshots via Cloudflare Workers or local mode

1.9k 2

Swirl Ai92

Swirl Design System AI package with artifacts for AI agents

14 2

io.github.HaD0Yun/gopeak92

GoPeak — The most comprehensive MCP server for Godot Engine. 95+ tools, LSP, DAP, screenshots.

225 4

Image MCP Server90

AI image generation and editing with prompt optimization and quality presets. Powered by Nano Banana

131 2

MCP Security Weekly

Get CVE alerts and security updates for Better Design and similar servers.

Community

Discussion

Start a conversation

Ask a question, share a tip, or report an issue.

Has anyone used this with Cursor?How do you handle auth?Any alternatives?

Edit this pageView history

Design

Step 1

Install in your client

Config is the same across clients — only the file and path differ.

Supported in Claude Desktopstdio, sse, http · Node 18+

Paste into ~/Library/Application Support/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "better-design": {
      "args": [
        "/absolute/path/to/better-design/packages/mcp/dist/index.js"
      ],
      "command": "node"
    }
  }
}

Are you the author?

Add this badge to your README to show your security score and help users find safe servers.

Embed in your READMEAbout badges →

[![MCPpedia Score](https://mcppedia.org/api/badge/better-design)](https://mcppedia.org/s/better-design)

Read me

What Better Design does

Turn your AI coding IDE into a design engineer. Better Design works with MCP-compatible agents and editors like Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop, and claude.ai. It is a design MCP server, AI design-system registry, and UI review layer for generating polished product interfaces from prompts.

Test This Server

This server supports HTTP transport. Be the first to test it — help the community know if it works.

README

Better Design: Open source Claude Design

Turn your AI coding IDE into a design engineer. Better Design works with MCP-compatible agents and editors like Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop, and claude.ai. It is a design MCP server, AI design-system registry, and UI review layer for generating polished product interfaces from prompts.

Website · Design systems · Setup · Contributing

What is Better Design?

Better Design gives AI coding agents the design context they usually miss: design tokens, component code, UI principles, icon direction, accessibility checks, and visual-design review rules.

Think of it as a Claude Design-style workflow for your own codebase:

Pick the product direction: Linear, Supabase, Vercel, Airbnb, Stripe, Apple, Notion, Figma, or another curated design system.
Feed your AI agent the right globals.css, semantic tokens, component overrides, icon set, spacing, typography, shadows, radius, and motion language.
Ask Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop, claude.ai, or another MCP-compatible coding agent to build the interface.
Have the MCP review the output against accessibility and design principles before you ship it.

Instead of "AI-looking UI," you get interfaces that look like they were built from a real product design system.

Why Better Design?

Claude Design-style workflow, open MCP. Bring the artifact-first design loop people expect from Claude Design into Claude Code, Cursor, VS Code/GitHub Copilot, Claude Desktop, claude.ai, and any MCP-compatible client.
Design systems, not vague vibes. Each system includes semantic CSS tokens plus production component code, so generated UI uses real implementation details instead of guessed colors.
AI UI generation with guardrails. The MCP can load principles for hierarchy, spacing, typography, depth, motion, forms, and accessibility exactly when the agent needs them.
Self-review before handoff. get-review-rules gives your agent a WCAG and visual-design checklist so it can catch missing focus states, weak hierarchy, bad contrast, and inconsistent spacing.

How it works

Better Design has two layers: an always-on Design Intelligence layer and an on-demand Scaffold layer.

Design Intelligence — always active for UI work

When your agent builds UI, Better Design loads the relevant product-design principles and review rules automatically:

You: "Add a settings page with a form"

AI: calls get-ui-principle("spacing") + get-ui-principle("hierarchy")
 → writes the page
 → calls get-review-rules("accessibility") + get-review-rules("visual-design")
 → fixes contrast, labels, focus states, spacing, and hierarchy

Scaffold — design-system matching for new UI

When starting a product, page, or component set, say "use better-design" and the MCP finds a matching design system:

You: "Build a fintech dashboard in the style of Stripe. use better-design"

AI: calls resolve-design-system("fintech dashboard, Stripe")
 → loads design-system docs, CSS tokens, and component code
 → resolves a matching icon library
 → builds with semantic tokens instead of raw colors

What the MCP gives your agent

Tool	What it does	Why it matters
`resolve-design-system`	Semantically matches the right design system for a pro

... View full README on GitHub

Loading README…

Scored, not listed

Why this score

Five weighted categories — click any category to see the underlying evidence.

Score breakdown

74/100across 5 weighted dimensions

How we score →

0255075100

−26

Security

Maintenance

Efficiency

Documentation

Compatibility

Categoriesclick a row to see evidence

Security

OSV.dev

No known CVEs.

No package registry to scan.

Inventory

Tools (2)

Click any tool to inspect its schema.

~51 tokens total

Community

Reviews

Be the first to review

Have you used this server?

Share your experience — it helps other developers decide.

How easy was setup?Did it work reliably?How was the documentation?

Frequently Asked Questions

Is Better Design safe to use?: Better Design has no known CVEs as of the latest MCPpedia security scan. It does not require authentication, so any local process can connect — keep this in mind in shared environments. Licensed under MIT.
How do I install Better Design?: Better Design supports copy-paste install configs on its MCPpedia page for Claude Desktop, Cursor, and Claude Code. Scroll to the Quick Install section and select your client.
What can Better Design do?: Better Design provides 2 tools: Setup, Contributing. See the full tools list on the server page for descriptions and parameters.
What AI clients work with Better Design?: Better Design is compatible with claude-desktop, cursor, claude-code. It uses stdio and sse and http transport.
Is Better Design actively maintained?: Better Design is actively maintained — last commit was 11 days ago. It has 157 GitHub stars.