MCP Server

Let your AI assistant browse, search, and install Catppuccin Components directly from the editor.

What it does

The MCP server exposes the component registry as a set of tools that any Model Context Protocol client can call. Claude, Cursor, and other MCP-aware editors can list components, read source code, and run the install command — all without leaving the conversation.

Available tools

list_components

Returns every available component with a short description.

search_components

Keyword search across component names and descriptions.

get_component

Fetches the full source code and props for a single component.

get_component_usage

Returns import patterns and usage examples.

install_component

Runs the shadcn CLI to install a component into your project. Auto-detects your package manager.

list_setup

Lists infrastructure resources — base CSS, Tailwind config, theme provider.

get_setup

Fetches a specific setup resource by key.

Claude Code

Add the server to your project's .claude/settings.json:

{
  "mcpServers": {
    "catppuccin-ui": {
      "command": "node",
      "args": ["./mcp/bin/server.mjs"]
    }
  }
}

Cursor

Add to .cursor/mcp.json in your project root:

{
  "mcpServers": {
    "catppuccin-ui": {
      "command": "node",
      "args": ["./mcp/bin/server.mjs"]
    }
  }
}

Without cloning the repo

You can point the server at the published registry without having the source locally. The server fetches component JSON from catppuccin.d14y.com/r/ by default, so it works anywhere with network access.

npx catppuccin-ui-mcp

How it works

The server is a lightweight Node script (~250 lines) built on @modelcontextprotocol/sdk. It reads component metadata from a static registry and fetches source code on demand from the public JSON endpoint. Install commands shell out to shadcn@latest add using whichever package manager your project uses.