What is a #design-system MCP server?
An MCP server tagged #design-system implements the Model Context Protocol so AI assistants like Claude, Cursor, and VS Code can access design-system-related tools, data, or APIs.
16 #design-system MCP Servers & Clients
Every MCP server and client below is tagged #design-system — install one to give Claude, Cursor, VS Code, or any other MCP-compatible client access to design-system tools.
All
Vibe Design System
mondaycom
🎨 Vibe Design System - Official monday.com UI resources for application development in React.js
Added 2 years ago
Mimic Ai
miapre
The design system copilot that builds Figma from HTML using your real components and tokens. Learns your system, surfaces your gaps.
Added 7 months ago
mcp-design-system-extractor
freema
MCP (Model Context Protocol) server that enables AI assistants to interact with Storybook design systems. Extract component HTML, analyze styles, and help with design system adoption and refactoring.
Added last year
Design System MCP Server
pglevy
A proof-of-concept for publish design system guidance and code snippets as an MCP server for usage with LLMs
Added last year
Ai Canvas Mcp (@aicanvas/mcp)
uiNerd16
Browse and install 75+ free animated, shadcn-compatible React components from AI Canvas, each with AI reproduction prompts. Read-only MCP server over the live aicanvas.me registry; eight tools.
Added 4 months ago
VA Design System Monitor
amponce
Open source MCP server for monitoring Department of Veterans Affairs design system usage and compliance
Added last year
Designesy
LE-VAI
Design quality gate for AI-generated UI. Scores any live URL against a published contract of deterministic checks, with an A–F grade, a per-check breakdown and AI-slop pattern findings; validates DTCG token files and Lot
Added 3 months ago
Marmoui
mahmoudilyan
Design-system knowledge for AI agents: live React component APIs, patterns, and generated-code validation. Agents build real dashboards, not slop. Free.
Added 4 months ago
UXKIN
Real UI references for AI coding agents: 500,000+ real screens, 15k+ website design systems with a DESIGN.md, and 30k+ UI elements, so your agent builds UI that looks real, not AI slop.
Added 19 days ago
Layro
Uvxxsh
Layro connects your AI coding tool (Cursor, Claude Code, VS Code, Windsurf, Codex, Gemini CLI) to 112 production React, TypeScript and Tailwind CSS components. Your agent can search the library, read each component's pro
Added 13 days ago
Eased
easedui
Eased is a library of motion-first React components for shadcn, installed with the shadcn CLI.
Added 6 days ago
TM
Tokven Mcp
Mihkel00
Generate complete design token systems from a hex color — OKLCH-derived, WCAG-validated, multi-format
Added 7 months ago
PD
Page Design Guide Mcp Server
chihebnabil
An MCP (Model Context Protocol) server that provides design guidance to help LLMs generate better, more modern web pages. This server focuses on teaching design principles and best practices rather than providing code templates.
Added 10 months ago
Popmelt MCP Server
avantjohn
Added 2 years ago
Typeui
bergside
Build better interfaces with TypeUI design systems, UI prompts, and layout variations.
Added 5 months ago
Klavis AI 🌟
alexgolemelectrico
Klavis AI (YC X25): Open Source, easy to use MCPs on Slack, Discord and Web
Added 2 years ago
Frequently asked questions
Common questions about MCP servers and clients tagged #design-system
How many #design-system MCP servers and clients are there?
mcp.so currently lists 16 MCP servers and clients tagged #design-system.
How do I install a #design-system MCP server?
Open any server below and copy its install snippet into Claude Desktop, Cursor, VS Code, or another MCP client's configuration — remote servers need no separate download.