Shadcn MCP for JetBrains
Learn how to install Shadcn MCP for JetBrains IDEs (WebStorm, IntelliJ IDEA). Connect AI Assistant to shadcn/ui components using MCP servers for smarter coding assistance.
Issues setting up the MCP in JetBrains?
Join our Discord community for help from other developers.
How to install Shadcn MCP for JetBrains
Look, if you're here, you probably already know that JetBrains IDEs (WebStorm, IntelliJ IDEA) with AI Assistant are pretty solid for React development. But here's the thing—when you ask AI Assistant about shadcn/ui components, it's been flying blind, working off whatever it remembered from training instead of actual, current component data.
That's where MCP (Model Context Protocol) comes in. Think of it as giving JetBrains AI Assistant a direct line to the shadcn/ui component registry and the entire shadcn.io community ecosystem. No more "this might be outdated" disclaimers.
Your first 5 minutes with Shadcn MCP
Install the MCP server
Go to Settings | Tools | AI Assistant | Model Context Protocol (MCP) or type / in the AI chat and select Add Command.
Click Add to add a new MCP server configuration.
Configure the server:
- Name:
shadcn - Command:
npx - Arguments:
-y mcp-remote https://www.shadcn.io/api/mcp - Level: Choose Global (all projects) or Current Project
Click OK and then Apply to start the server.
Enable Codebase mode
Make sure Codebase mode is enabled in AI Assistant. This is required for MCP tools to work properly.
The shadcn tools will appear in the AI Assistant and can be triggered automatically or manually via / commands.
Explore available components
use shadcn to list all components availableWatch AI Assistant pull up-to-date component information directly from the registry. No guessing, no outdated docs—just current component data.
Get component details
use shadcn and show me details about the color picker componentAI Assistant can now see actual component implementations, props, and usage patterns. Real information about how components actually work.
That's it. Four simple steps and JetBrains AI Assistant now has access to the entire shadcn/ui component registry and the custom shadcn.io components and utilities.
What is JetBrains MCP support anyway?
JetBrains IDEs support MCP through AI Assistant, allowing you to connect to external MCP servers that extend the AI's capabilities. Think of it as giving your IDE's AI access to real-time tools and knowledge bases beyond what it learned during training.
The killer feature? AI Assistant can invoke MCP tools automatically when processing your requests, or you can trigger them manually with / commands, making it ecosystem-aware instead of just context-aware.
What this actually gets you
| Prompt | Without MCP | With MCP |
|---|---|---|
| "How do I customize the color picker component?" | Generic HTML5 color input or random React examples | Exact color picker from shadcn.io registry with proper form integration |
| "Show me button variants" | Maybe mentions primary/secondary if you're lucky | All 6 actual variants with real examples |
| "I need a data table with sorting" | Basic table implementations from training data | The actual Data Table component with working sort/filter patterns |
Shadcn MCP for VS Code
Learn how to install Shadcn MCP for VS Code. Connect GitHub Copilot agent mode to shadcn/ui components using MCP servers for smarter coding assistance.
Shadcn MCP for Zed
Learn how to install Shadcn MCP for Zed. Connect Zed's AI agent to shadcn/ui components using MCP servers for smarter coding assistance.