MCP Server
The Shadcn UI Kit MCP server lets your AI editor search the catalog and use real blocks, components and dashboard pages from the kit instead of generating UI from scratch. It is included in the Pro, Team and Enterprise plans.
Connection details
- URL:
https://shadcnuikit.com/api/mcp(remote MCP over HTTP) - Header:
Authorization: Bearer YOUR_API_KEY
Use the same API key as the shadcn CLI. Create one in API Keys.
Claude Code
claude mcp add --transport http shadcnuikit https://shadcnuikit.com/api/mcp \
--header "Authorization: Bearer YOUR_API_KEY"
Cursor
Add this to .cursor/mcp.json:
{
"mcpServers": {
"shadcnuikit": {
"url": "https://shadcnuikit.com/api/mcp",
"headers": {
"Authorization": "Bearer YOUR_API_KEY"
}
}
}
}
VS Code
Add this to .vscode/mcp.json:
{
"servers": {
"shadcnuikit": {
"type": "http",
"url": "https://shadcnuikit.com/api/mcp",
"headers": {
"Authorization": "Bearer YOUR_API_KEY"
}
}
}
}
Any other client that supports remote MCP servers over HTTP works with the URL and header above.
Available tools
| Tool | What it does |
|---|---|
list_categories | Lists the catalog categories and how many variants each has. |
search_catalog | Finds blocks, components, examples and illustrations by keyword or category. |
get_item_code | Returns the full source, file paths and dependencies of up to four items. |
plan_page | Suggests a page blueprint, for example a SaaS landing page, dashboard, store or auth screen. |
list_dashboards | Lists the ready-made dashboards, apps, pages, auth screens and the dashboard shell. |
get_dashboard | Returns a shadcn CLI install command and the files for one dashboard page. |
Good to know
- The server only reads the catalog. It does not read or upload your code and does not overwrite your components.
- Dashboard pages are built for the Next.js App Router, and installing them needs terminal access.
- Try prompts such as “Build a pricing page with Shadcn UI Kit blocks” or “Add the CRM dashboard from Shadcn UI Kit”.