Shadcn MCP

Browse and install blocks with an AI assistant. The Shadcn MCP server lets tools like Cursor, Claude Code, and VS Code read our registry and add blocks in natural language.

The Shadcn MCP server is part of the shadcn/ui open source project. For the full client list and options, see the Shadcn MCP docs.

What is MCP?

The Model Context Protocol is an open standard that connects AI assistants to outside tools and data. With the Shadcn MCP server running, your assistant can read the registries in your project, search them, and install components for you, all from a prompt.

Point it at the @shadcn-ui-blocks registry and it can find and add any block you own without you leaving the editor.

Set up the server

  1. 1

    Configure the registry

    The MCP server reads your project's components.json, so add our registry there. For blocks you own, include your API key with a Bearer header (the Shadcn CLI guide covers creating a key).

    components.json
    {
  "registries": {
    "@shadcn-ui-blocks": {
      "url": "https://www.shadcn-ui-blocks.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${SHADCN_UI_BLOCKS_API_KEY}"
      }
    }
  }
}
  2. 2

    Add the server to your tool

    Run the init command for your client. Swap cursor for vscode, claude, or codex as needed:

    Terminal
    npx shadcn@latest mcp init --client cursor

    Or add the server to your client's MCP config by hand:

    MCP config
    {
  "mcpServers": {
    "shadcn": {
      "command": "npx",
      "args": ["shadcn@latest", "mcp"]
    }
  }
}
    After adding the server, restart your editor so it picks up the change.
  3. 3

    Ask for a block

    With the server connected, describe what you want and let the assistant install it. For example:

    • "Find a hero section in @shadcn-ui-blocks and add it."
    • "Install the modern SaaS pricing block from Shadcn UI Blocks."
    • "Show me the testimonial blocks I own, then add one."

Next steps