shadcn
Provides tools to install and manage shadcn/ui components directly from the AI agent.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@shadcninstall a button component"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
ai-factory-extension-shadcn-mcp
An ai-factory extension that bundles the shadcn/ui MCP server for AI coding agents — tools to install and manage shadcn/ui components directly from the agent.
Quick Start
# from a local directory
ai-factory extension add ./ai-factory-extension-shadcn-mcp
# or from a git repo
ai-factory extension add https://github.com/dealenx/ai-factory-extension-shadcn-mcp.gitai-factory merges the MCP server configs into every agent that supports MCP (Claude Code, Cline, etc.).
Related MCP server: Shadcn Space MCP
What Gets Installed
After installation your agent's MCP configuration will include:
{
"mcpServers": {
"shadcn": {
"command": "npx",
"args": ["shadcn@latest", "mcp"]
}
}
}Project Structure
ai-factory-extension-shadcn-mcp/
├── extension.json # Extension manifest (required)
├── mcp/ # MCP server templates
│ └── shadcn.json # shadcn/ui MCP server
├── package.json
├── LICENSE
└── README.mdHow It Works
extension.json
The manifest declares which MCP servers the extension provides:
{
"name": "ai-factory-extension-shadcn-mcp",
"version": "1.0.0",
"description": "ai-factory extension: shadcn/ui MCP server",
"mcpServers": [
{
"key": "shadcn",
"template": "./mcp/shadcn.json",
"instruction": "shadcn/ui MCP: provides tools to install and manage shadcn/ui components"
}
]
}Field | Description |
| Unique identifier for the server entry in the agent's settings file. |
| Path to a JSON file with the server's command, args, and env. |
| Message shown to the user after install (e.g. required env vars). |
MCP Templates (mcp/*.json)
Each template follows the standard MCP server format:
mcp/shadcn.json
{
"command": "npx",
"args": ["shadcn@latest", "mcp"]
}Managing the Extension
# List installed extensions
ai-factory extension list
# Remove the extension (cleans up MCP entries from agent configs)
ai-factory extension remove ai-factory-extension-shadcn-mcpDocumentation
ai-factory Extensions Guide — full reference for extension manifest fields, MCP servers, injections, commands, skills, and agents.
License
Related MCP Connectors
MCP server for AI dialogue using various LLM models via AceDataCloud
MCP server connecting AI agents to 100+ apps (Gmail, Slack, Notion, GitHub) via one-click OAuth.
Official MCP server for Agentwork — delegate tasks to AI agents with human-in-the-loop
Related MCP Servers
- AlicenseAqualityDmaintenanceA mcp server to allow LLMS gain context about shadcn ui component structure,usage and installation102,148 npm2,989MIT
- AlicenseAqualityDmaintenanceIntegrate Shadcn Space MCP server into your IDE to generate ready-to-use shadcn/ui components without guesswork.548 npm3MIT
- AlicenseAqualityFmaintenanceAn MCP server that enables AI assistants to search, discover, and install Aceternity UI components programmatically.5252 npm23MIT
- AlicenseAqualityCmaintenanceA secure MCP server that gives AI coding assistants direct access to the shadcn/ui registry, enabling fetching, installing, and wiring up components without switching context.815 npm4MIT