shadcn-ui MCP Server
@mamba-mental
shadcn-ui MCP Server について
概要はまだありません
基本情報
設定
以下の設定を使って、このサーバーを MCP 対応クライアントに追加してください。
{
"mcpServers": {
"shadcn-ui-server": {
"command": "npx",
"args": [
"-y",
"shadcn-ui-mcp-server"
]
}
}
}ツール
4Get a list of all available shadcn/ui components
Get detailed information about a specific component
Get usage examples for a specific component
Search for components by keyword
概要
What is shadcn-ui MCP Server?
It is a TypeScript-based MCP (Model Context Protocol) server that provides reference information for shadcn/ui components. It helps AI assistants access component documentation, installation instructions, usage examples, props, variants, and code samples by scraping the official shadcn/ui documentation site and GitHub repository.
How to use shadcn-ui MCP Server?
Install dependencies with npm install, build the server with npm run build, then configure it in your MCP client (Claude Desktop, Windsurf, or Cursor) using either the built index.js path or the npx command npx -y shadcn-ui-mcp-server. For development, use npm run watch for auto-rebuild.
Key features of shadcn-ui MCP Server
- Provides four tools:
list_shadcn_components,get_component_details,get_component_examples, andsearch_components - Scrapes and caches data from the official shadcn/ui website and GitHub repository
- Returns structured component descriptions, installation instructions, and usage examples
- Supports searching components by keyword
- Written in TypeScript for type safety
Use cases of shadcn-ui MCP Server
- An AI assistant retrieving detailed info about a specific shadcn/ui component
- A developer searching for components that match a keyword in their IDE
- Automated generation of component examples for documentation or tutorials
- Integrating shadcn/ui component references into a larger MCP‑enabled toolchain
FAQ from shadcn-ui MCP Server
What tools does the shadcn-ui MCP Server provide?
It provides four tools: list_shadcn_components, get_component_details, get_component_examples, and search_components.
How do I install and configure the shadcn-ui MCP Server?
Install dependencies with npm install, build with npm run build, then add the server configuration to Claude Desktop, Windsurf, or Cursor using either the local build path or the npx command npx -y shadcn-ui-mcp-server.
What data sources does it use?
It scrapes and caches information from the official shadcn/ui documentation site (https://ui.shadcn.com) and the shadcn/ui GitHub repository.
How can I debug the shadcn-ui MCP Server?
The recommended method is the MCP Inspector, which can be started via npm run inspector. It provides a URL to access debugging tools in your browser.
Is there a development mode with auto-rebuild?
Yes, run npm run watch to automatically rebuild the server when source files change.
「その他」の他のコンテンツ
IDA Pro MCP
mrexodiaAI-powered reverse engineering assistant that bridges IDA Pro with language models through MCP.
Unity MCP ✨
justinpbarnettUnity MCP acts as a bridge between AI assistants and your Unity Editor. Give your LLM tools to manage assets, control scenes, edit scripts, and automate tasks within Unity.
Production-ready MCP integrations for AI applications
Klavis-AIKlavis AI: MCP integration platforms that let AI agents use tools reliably at any scale
Awesome Mcp Servers
punkpeyeA collection of MCP servers.
ghidraMCP
LaurieWiredMCP Server for Ghidra
コメント