A powerful and flexible MCP (Model Control Protocol) server designed to enhance the development experience with Shadcn UI components. This server provides a robust foundation for building and managing UI components with advanced tooling and functionality.
The MCP server provides a set of tools that can be used through the Model Control Protocol:
list-components
: Get the list of available shadcn/ui componentsget-component-docs
: Get documentation for a specific componentinstall-component
: Install a shadcn/ui componentlist-blocks
: Get the list of available shadcn/ui blocksget-block-docs
: Get documentation for a specific blockinstall-blocks
: Install a shadcn/ui blockComponent Management
Block Management
Package Manager Support
To use with Claude Desktop, add the server config:
On MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json
On Windows: %APPDATA%/Claude/claude_desktop_config.json
{
"mcpServers": {
"shadcn-ui-server": {
"command": "npx",
"args": ["@heilgar/shadcn-ui-mcp-server"]
}
}
}
Add this to your ./codeium/windsurf/model_config.json
:
{
"mcpServers": {
"shadcn-ui-server": {
"command": "npx",
"args": ["@heilgar/shadcn-ui-mcp-server"]
}
}
}
Add this to your .cursor/mcp.json
:
{
"mcpServers": {
"shadcn-ui-server": {
"command": "npx",
"args": ["@heilgar/shadcn-ui-mcp-server"]
}
}
}
npm install
npm run build
Since MCP servers communicate over stdio, debugging can be challenging. We recommend using the MCP Inspector for debugging:
npm run inspector
The Inspector will provide a URL to access debugging tools in your browser, allowing you to:
This project is built using the following tools and libraries:
MIT License - feel free to use this project for your own purposes.
Contributions are welcome! Please feel free to submit a Pull Request.