Skip to content

MCP Server

Configure the Neobrutalism.com MCP server so your AI editor can add components by name in Claude Code, Cursor, and VS Code.

The Model Context Protocol (MCP) server pulls Neobrutalism.com components straight into your AI-assisted workflow. Ask your editor for a component in plain English — Claude Code, Cursor, VS Code, and any other MCP-enabled editor can install it with the correct configuration, no URL-pasting involved.

Under the hood it's the shadcn CLI's own MCP server, pointed at the Neobrutalism.com registry. For background, see the shadcn MCP documentation.

Automatic Configuration

Claude Code

pnpm dlx shadcn@latest mcp init --client claude
npx shadcn@latest mcp init --client claude
yarn dlx shadcn@latest mcp init --client claude
bunx --bun shadcn@latest mcp init --client claude

Cursor

pnpm dlx shadcn@latest mcp init --client cursor
npx shadcn@latest mcp init --client cursor
yarn dlx shadcn@latest mcp init --client cursor
bunx --bun shadcn@latest mcp init --client cursor

VS Code

pnpm dlx shadcn@latest mcp init --client vscode
npx shadcn@latest mcp init --client vscode
yarn dlx shadcn@latest mcp init --client vscode
bunx --bun shadcn@latest mcp init --client vscode

Manual Configuration

First, install shadcn as a dev dependency:

pnpm add -D shadcn@latest
npm install -D shadcn@latest
yarn add -D shadcn@latest
bun add -D shadcn@latest

Then configure the MCP server for your editor.

Claude Code

Add the following to your .mcp.json:

.mcp.json
{
  "mcpServers": {
    "shadcn": {
      "command": "npx",
      "args": ["shadcn@latest", "mcp"]
    }
  }
}

Cursor

Add the following to your .cursor/mcp.json:

.cursor/mcp.json
{
  "mcpServers": {
    "shadcn": {
      "command": "npx",
      "args": ["shadcn@latest", "mcp"]
    }
  }
}

VS Code

Add the following to your .vscode/mcp.json:

.vscode/mcp.json
{
  "servers": {
    "shadcn": {
      "command": "npx",
      "args": ["shadcn@latest", "mcp"]
    }
  }
}

Point it at the registry

The MCP server resolves components through named registries, so this is the one place the registry alias is required. Add it to your project's components.json:

components.json
{
  "registries": {
    "@neobrutalism": "https://neobrutalism.com/r/radix/{name}.json",
    "@neobrutalism-base": "https://neobrutalism.com/r/base/{name}.json"
  }
}

Usage

Once configured, ask for components in plain English:

  • → "Add a neobrutalism button component"
  • → "Install the accordion from the neobrutalism registry"
  • → "Add the card component with the neobrutalist style"

The server installs the component source into your project — the same open code you'd get from the CLI, with the paths and config already resolved.