shadcn ui
npxVerifiedThis MCP server provides AI agents with context about shadcn/ui component structure, usage, and installation. It exposes tools for integrating shadcn/ui components into AI workflows, compatible with React, Svelte 5, Vue, and React Native. The server connects to shadcn/ui documentation and component libraries, making it useful for developers building or maintaining applications with these frameworks.
2,6632830Updated 2 weeks ago
Overview
This MCP server provides AI agents with context about shadcn/ui component structure, usage, and installation. It exposes tools for integrating shadcn/ui components into AI workflows, compatible with React, Svelte 5, Vue, and React Native. The server connects to shadcn/ui documentation and component libraries, making it useful for developers building or maintaining applications with these frameworks.
Installation
1Install the package
npx
npx -y @jpisnice/shadcn-ui-mcp-server2Add to Claude
Add this configuration to your claude_desktop_config.json:
claude_desktop_config.json
{
"mcpServers": {
"jpisnice-shadcn-ui-mcp-server-github": {
"command": "npx",
"args": [
"-y",
"npx -y @jpisnice/shadcn-ui-mcp-server"
]
}
}
}3Verify installation
Restart Claude Desktop, then ask:
"What tools do you have available from shadcn ui?"
Prerequisites
- Node.js 18 or higher
- npm or npx available
- Claude Desktop or Claude API access
- API key for shadcn ui
Configuration
API Key Required
This server requires an API key from shadcn ui. Add it to your environment or config.
| Variable | Required | Description |
|---|---|---|
| SHADCN_UI_API_KEY | Yes | Your shadcn ui API key |
Usage Examples
List Resources
"What resources are available in shadcn ui?"
Claude will query available resources and return a list of what you can access.
Get Details
"Show me details about [specific item] in shadcn ui"
Claude will fetch and display detailed information about the requested item.
Create New
"Create a new [item] in shadcn ui with [details]"
Claude will use the appropriate tool to create the resource and confirm success.
Works with shadcn ui
Related skills
Browse all skillsNeed help with MCP integration?
We build custom MCP integrations for B2B companies. From simple connections to complex multi-tool setups.