Better Design MCP Server

by better-designsio.github.marvkr/better-designv0.37.0

A design harness for AI coding agents: design systems, design principles, icons and UI review.

1Node.jsstdioremoteofficial registry

context tax

queued

security

queued

cold start

queued

freshness

Active6d ago

Install Better Design MCP server

claude mcp add better-design -e BETTER_DESIGN_API_KEY='<better-design-api-key>' -- npx -y better-design mcp

{
  "mcpServers": {
    "better-design": {
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "<better-design-api-key>"
      }
    }
  }
}

Add to ~/.cursor/mcp.json (global) or .cursor/mcp.json (project).

{
  "mcpServers": {
    "better-design": {
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "<better-design-api-key>"
      }
    }
  }
}

Settings → Developer → Edit Config (claude_desktop_config.json), then restart.

{
  "servers": {
    "better-design": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "<better-design-api-key>"
      }
    }
  }
}

Add to .vscode/mcp.json in your workspace.

{
  "mcpServers": {
    "better-design": {
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "<better-design-api-key>"
      }
    }
  }
}

Add to ~/.codeium/windsurf/mcp_config.json.

Configuration

Variable	Required	Secret	Description
BETTER_DESIGN_API_KEY	yes	yes	Create or manage a key at https://better-design.com/mcp

Remote endpoints

streamable-httphttps://better-design.com/api/mcp

Freshness

Active — last maintenance signal 6d ago. The newest of the signals below sets the band.

Last commit (default branch)
2026-10-04 · 6d ago · GitHub
Latest release
no data · GitHub
Package published
no data · npm/PyPI
Registry entry updated
2026-10-04 · 6d ago · official registry · v0.37.0

FAQ

›How do I install the Better Design MCP server in Claude Code?

Run: claude mcp add better-design -e BETTER_DESIGN_API_KEY='<better-design-api-key>' -- npx -y better-design mcp. For Cursor, VS Code, Claude Desktop and Windsurf, use the install tabs above.

›Does Better Design require an API key?

Yes. It expects BETTER_DESIGN_API_KEY, of which 1 is a secret.

›Can I use Better Design as a remote (hosted) MCP server?

Yes — it offers both a hosted endpoint and a local stdio package.

›Is Better Design in the official MCP registry?

Yes, as io.github.marvkr/better-design.