# shadcn MCP Server

Servidor MCP oficial que permite a los asistentes de IA explorar, buscar e instalar componentes de shadcn/ui directamente desde registros usando lenguaje natural, impulsando el desarrollo de UI sin alucinaciones.

Canonical URL: https://a2a-mcp.org/entry/shadcn-mcp-server-es

Language: es

Category: MCP Servers

Updated: 2026-03-18

## Descripción general

El shadcn MCP Server es la implementación oficial del [Model Context Protocol (MCP)](https://modelcontextprotocol.io) para shadcn/ui. Permite que los asistentes y agentes de IA se conecten de forma segura a registros de componentes compatibles con shadcn, exploren los componentes disponibles, busquen elementos específicos, obtengan código fuente, demos y metadatos, e incluso los instalen directamente en los proyectos mediante instrucciones en lenguaje natural.

Esto elimina problemas comunes de la IA, como el uso de información desactualizada o la generación de props inexistentes, al proporcionar acceso en tiempo real y estructurado a los datos más recientes del registro e integrarse con el CLI de shadcn.

## Características

- **Explorar y buscar en registros**: La IA puede listar y consultar componentes, bloques y gráficos desde cualquier registro compatible con shadcn.
- **Obtener datos precisos**: Accede a código fuente actualizado en TypeScript, props/interfaces, ejemplos de uso y comandos de instalación.
- **Instalación directa**: Permite que la IA ejecute automáticamente comandos `shadcn add` mediante el puente CLI integrado.
- **Registros independientes del framework**: Funciona con cualquier registro shadcn (oficial o personalizado), incluyendo componentes basados en React y Tailwind.
- **Ejecución local y segura**: Se ejecuta como un servidor local (generalmente mediante npx o paquete instalado) con autenticación configurable.
- **Integración con IDE y herramientas**: Soporte nativo en herramientas como Cursor, Claude Desktop, Zed y otras compatibles con MCP.

## Cómo funciona

1. Instala el servidor MCP (normalmente mediante npx o configuración del proyecto).
2. Configura tu registro en `components.json`.
3. Conecta tu asistente de IA al endpoint MCP local.
4. Usa instrucciones en lenguaje natural como "añade un bonito dashboard con gráficos de shadcn" — la IA consulta el registro, selecciona los componentes y los instala.

## Casos de uso

- Prototipado de UI impulsado por IA en Cursor o Claude Code.
- Automatización de instalación de componentes en grandes bases de código.
- Creación de flujos de trabajo multiagente donde un agente investiga componentes y otro construye la UI.
- Integración de registros personalizados para sistemas de diseño empresariales.

## Primeros pasos

Consulta la documentación oficial: https://ui.shadcn.com/docs/mcp

Normalmente se inicia con:
```bash
npx shadcn@latest mcp
```
o configurándolo en tu proyecto y utilizándolo con herramientas de IA compatibles.

Existen múltiples forks de la comunidad y versiones mejoradas (por ejemplo, con soporte para múltiples frameworks como Svelte/Vue), pero la versión oficial de shadcn/ui es la recomendada para la mayoría de los usuarios.

## Tags

- shadcn
- mcp
- ai-agent
- ui-components
- registry
- typescript
- react
- tailwind
- claude
- cursor

## Sources

- [Project website](https://ui.shadcn.com/docs/mcp)