Best shadcn/ui MCP Servers
Beautifully designed components built with Radix UI and Tailwind CSS
Why this server?
Recommends and generates UI components compatible with shadcn/ui component library standards and patterns
AlicenseBqualityAmaintenanceA comprehensive development toolkit with 23 tools covering code quality analysis, development efficiency, and project management. Enables AI-assisted code review, test generation, performance analysis, SQL generation, UI component creation, and automated project documentation.829156 npm41MITWhy this server?
Searches shadcn/ui for copy-paste React components, enabling discovery of modern UI components and design patterns.
AlicenseAqualityBmaintenanceA stateless MCP server for UI/UX design inspiration, live component discovery, and modern web micro-effects, resolving queries in real time via the Serper API.2616 npm7MITWhy this server?
Generates UI components using shadcn/ui for React and Vue.

@forgespace/ui-mcpofficial
AlicenseBqualityFmaintenanceEnables AI-driven generation of UI components, full applications, and backend code across multiple frameworks (React, Vue, Angular, Svelte, HTML) with Figma integration and brand identity support.38128 npm2MITWhy this server?
Provides access to the Keyline Icons set, an icon library drawn for shadcn/ui (1,366 icons across stroke, two-tone, duotone and fill styles, in rounded and sharp corner treatments). Agents can search the set, fetch ready-to-paste SVG source in any style/corner combination, and get React import lines and JSX so icons can be pulled into a shadcn/ui project instead of being guessed or hand-drawn.

Keyline Iconsofficial
AlicenseAqualityNot gradedmaintenanceSearch the Keyline Icons set by name and fetch any icon's SVG source or React import, in four styles with rounded or sharp corners. Runs locally, no key needed.4187MITWhy this server?
Generates production-ready React components using shadcn/ui patterns and includes a shadcn registry server for component management and distribution.
AlicenseAqualityCmaintenanceDesign system MCP server. 20 tools: extract design tokens from any URL, pull from Figma or Penpot, generate React + shadcn/ui components from specs, run WCAG audits, sync tokens bidirectionally.50235 npm49MITWhy this server?
Allows scaffolding React components from 41 shadcn/ui templates.
AlicenseAqualityCmaintenance9 MCP servers for React + TypeScript development automation — component scaffolding, dependency auditing, WCAG accessibility checking, test generation, TypeScript enforcement, and monorepo management. 134 tests, CI on Node 20+22.7106 npm3MITWhy this server?
Provides comprehensive access to shadcn/ui v4 components, blocks, demos, and metadata, with support for React, Svelte, Vue, and React Native implementations, enabling AI-powered UI development and code generation.
AlicenseAqualityDmaintenanceProvides AI assistants with comprehensive access to shadcn/ui v4 components, blocks, demos, and metadata across React, Svelte, Vue, and React Native, enabling efficient component integration and code generation.107,345 npmMITWhy this server?
Provides searchable official shadcn/ui documentation, enabling agents to use UI components and styling patterns.
AlicenseAqualityAmaintenanceUltra-fast local markdown documentation RAG for AI coding agents, enabling instant BM25 search over official framework docs and live AI model registries via MCP.822 PyPI2MITWhy this server?
Provides a tool to judge whether a UI component requirement should be met with an existing shadcn/ui component, scoring coverage and returning a structured verdict for use_existing or custom_build.
AlicenseAqualityBmaintenanceEnables AI agents to receive a structured verdict on whether a UI component need can be satisfied by existing shadcn/ui or 21st.dev components or requires a custom build, with coverage scoring against real component evidence and a Mobbin reference when needed.1300 npm9MIT