Repolode
Submit
Jpisnice

Jpisnice/shadcn-ui-mcp-server

An MCP server that gives AI assistants access to shadcn/ui component source, demos, blocks and install metadata across React, Svelte, Vue and React Native.

View on GitHub
Stars
3,065
Forks
315
Open issues
7
Last commit
19 days ago

What is it?

This project is a Model Context Protocol (MCP) server that lets AI coding assistants look up shadcn/ui components, including their TypeScript source, demos, blocks such as dashboards and forms, and metadata on dependencies and configuration. Instead of guessing at component APIs, an assistant can read the actual implementation before generating code.

It covers four shadcn-style libraries: the React original, shadcn-svelte, shadcn-vue, and react-native-reusables for React Native. The framework is chosen with a command-line flag, and React users can switch the underlying primitive library between Radix UI and Base UI. The server runs over stdio for local clients such as Claude Desktop, Claude Code and Cursor, or over Streamable HTTP at a stateless /mcp endpoint with Docker Compose support. GitHub API access is cached and can use a personal access token to raise rate limits.

Key features

  • 01Returns component source code, demos and blocks for React, Svelte, Vue and React Native.
  • 02Provides dependency, description and configuration metadata for each component.
  • 03Supports browsing repository directory structures.
  • 04Offers stdio, Streamable HTTP and dual transport modes.
  • 05Includes argument autocomplete for prompts and resource templates.
  • 06Ships with Docker and Docker Compose configuration.

Use cases

  • Letting Claude Code or Cursor generate shadcn/ui-based interfaces that match the real component APIs.
  • Comparing how the same component is implemented across React, Svelte, Vue and React Native.
  • Running a shared MCP endpoint for a team of developers over HTTP.

Quick start

  1. 1

    Run the server with npx (60 requests/hour without a token)

    npx @jpisnice/shadcn-ui-mcp-server
  2. 2

    Run with a GitHub token for higher rate limits (5000 requests/hour)

    npx @jpisnice/shadcn-ui-mcp-server --github-api-key ghp_your_token_here
  3. 3

    Switch to another framework such as Svelte, Vue or React Native

    npx @jpisnice/shadcn-ui-mcp-server --framework svelte

Things to know

  • Without a GitHub token, GitHub API rate limits are low (60 requests/hour).
  • Ui-library option Base UI is available for React only.

In collections

MCP servers

Topics

#mcp#ai#shadcn-ui#react#vue#svelte#react-native#typescript#expo#modelcontextprotocol

FAQ

What is shadcn-ui-mcp-server?
An MCP server that gives AI assistants access to shadcn/ui component source, demos, blocks and install metadata across React, Svelte, Vue and React Native. This project is a Model Context Protocol (MCP) server that lets AI coding assistants look up shadcn/ui components, including their TypeScript source, demos, blocks such as dashboards and forms, and metadata on dependencies and configuration. Instead of guessing at component APIs, an assistant can read the actual implementation before generating code.
Is shadcn-ui-mcp-server free to use? What license does it have?
shadcn-ui-mcp-server is open source under the MIT license. Check the license terms before using it in commercial products.
Is shadcn-ui-mcp-server still maintained?
Actively maintained. The last commit to shadcn-ui-mcp-server was on Oct 3, 2026.
What can I use shadcn-ui-mcp-server for?
Letting Claude Code or Cursor generate shadcn/ui-based interfaces that match the real component APIs. Comparing how the same component is implemented across React, Svelte, Vue and React Native. Running a shared MCP endpoint for a team of developers over HTTP.
How do I install shadcn-ui-mcp-server?
Run the server with npx (60 requests/hour without a token): npx @jpisnice/shadcn-ui-mcp-server Run with a GitHub token for higher rate limits (5000 requests/hour): npx @jpisnice/shadcn-ui-mcp-server --github-api-key ghp_your_token_here Switch to another framework such as Svelte, Vue or React Native: npx @jpisnice/shadcn-ui-mcp-server --framework svelte
Where can I get shadcn-ui-mcp-server?
The source code and installation instructions are on GitHub: https://github.com/Jpisnice/shadcn-ui-mcp-server

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects