** 🚀 Shadcn/UI 컴포넌트를 AI 워크플로우에 가장 빠르게 통합하는 방법**

모델 컨텍스트 프로토콜(MCP) 서버로, AI 비서에게 shadcn/ui v4 컴포넌트, 블록, 데모, 메타데이터에 대한 포괄적인 접근을 제공합니다. AI 기반 개발 워크플로우를 위해 React, Svelte, Vue, React Native 구현을 원활하게 검색할 수 있습니다.

✨ 주요 특징

• ** 🎯 멀티프레임워크 지원** - React, Svelte, Vue, React Native 구현
• ** 📦 컴포넌트 소스 코드** - 최신 shadcn/ui v4 TypeScript 소스
• ** 🎨 컴포넌트 데모** - 예제 구현 및 사용 패턴
• ** 🏗️ 블록 지원** - 완전한 블록 구현(대시보드, 캘린더, 폼)
• ** 📋 메타데이터 접근** - 의존성, 설명 및 구성 세부사항
• ** 🔍 디렉터리 탐색** - 저장소 구조 탐색
• ** ⚡ 스마트 캐싱** - 속도 제한 처리와 프로토콜 캐시 힌트(ttlMs/cacheScope)를 리스트 및 읽기 결과에 적용하는 효율적인 GitHub API 통합
• ** ⌨️ 인자 완성** - 프롬프트 및 리소스-템플릿 인자(컴포넌트 이름, 패키지 관리자, 빌드 도구 등)를 위한 자동 완성

Shadcn UI v4 MCP Server

🚀 The fastest way to integrate shadcn/ui components into your AI workflow

A Model Context Protocol (MCP) server that provides AI assistants with comprehensive access to shadcn/ui v4 components, blocks, demos, and metadata. Seamlessly retrieve React, Svelte, Vue, and React Native implementations for your AI-powered development workflow.

✨ Key Features

• 🎯 Multi-Framework Support - React, Svelte, Vue, and React Native implementations
• 📦 Component Source Code - Latest shadcn/ui v4 TypeScript source
• 🎨 Component Demos - Example implementations and usage patterns
• 🏗️ Blocks Support - Complete block implementations (dashboards, calendars, forms)
• 📋 Metadata Access - Dependencies, descriptions, and configuration details
• 🔍 Directory Browsing - Explore repository structures
• ⚡ Smart Caching - Efficient GitHub API integration with rate limit handling, plus protocol cache hints (ttlMs/cacheScope) on list and read results
• ⌨️ Argument Completion - Autocomplete for prompt and resource-template arguments (component names, package managers, build tools, and more)
• 🌐 Streamable HTTP Transport - Stateless /mcp endpoint for multi-client deployments (MCP spec 2026-07-28)
• 🐳 Docker Ready - Production-ready containerization with Docker Compose

🚀 Quick Start

# Basic usage (60 requests/hour)
npx @jpisnice/shadcn-ui-mcp-server

# With GitHub token (5000 requests/hour) - Recommended
npx @jpisnice/shadcn-ui-mcp-server --github-api-key ghp_your_token_here

# Switch frameworks
npx @jpisnice/shadcn-ui-mcp-server --framework svelte
npx @jpisnice/shadcn-ui-mcp-server --framework vue
npx @jpisnice/shadcn-ui-mcp-server --framework react-native

# Use Base UI instead of Radix (React only)
npx @jpisnice/shadcn-ui-mcp-server --ui-library base

🎯 Get your GitHub token in 2 minutes: docs/getting-started/github-token.md

📦 One-Click Installation (Claude Desktop)

Download and double-click the .mcpb file for instant installation:

1. Download shadcn-ui-mcp-server.mcpb from Releases
2. Double-click the file - Claude Desktop opens automatically
3. Enter your GitHub token (optional, for higher rate limits)
4. Click Install - tools are available immediately