Saltar al contenido

shadcn, servidor MCP

Explora, busca e instala componentes y bloques de shadcn/ui en lenguaje natural, desde cualquier registro que uses.

Oficialde shadcn/uiSe ejecuta en tu computadoraVerificado el 27 de octubre de 2026

El servidor MCP de shadcn, del proyecto shadcn/ui, permite que Claude liste, busque y vea los componentes, bloques y plantillas del registro de shadcn/ui y de cualquier otro registro configurado en el components.json de tu proyecto, incluidas las bibliotecas privadas de tu empresa. Para los elementos que elijas devuelve el comando npx shadcn add exacto, así los componentes llegan a tu proyecto con un pedido en lenguaje natural. Se ejecuta en tu computadora con la CLI de shadcn y no necesita cuenta.

Para quién es

  • Desarrolladores que crean interfaces con shadcn/ui
  • Quienes crean sitios web con Claude Code o Cursor
  • Equipos que comparten una biblioteca privada de componentes

Prompts para probar

Cuando esté conectado, pide lo que quieras con tus palabras. Tu herramienta de IA decide cuándo usar el servidor y te pregunta antes de cambiar algo importante.

Prompt 1
Muéstrame los bloques de login del registro de shadcn y agrega el más simple a mi proyecto.
Prompt 2
Crea una sección de precios con componentes de shadcn: tres tarjetas de planes, un selector mensual o anual y un acordeón de preguntas frecuentes.
Prompt 3
Busca el ejemplo de tabla de datos en el registro de shadcn y adáptalo para listar mis pedidos.

Cómo añadir el servidor MCP shadcn a Claude

MCP es un estándar abierto, así que este servidor funciona en Claude, ChatGPT, Codex, Cursor, VS Code y más. Elige tu herramienta:

Lo más fácil: pega esto en Claude Code
Conecta por mí el servidor MCP de shadcn a Claude Code: ejecuta este comando: npx shadcn@latest mcp init --client claude
Si un valor empieza por YOUR_, pídemelo primero. Cuando esté conectado, ayúdame a iniciar sesión si hace falta y muéstrame algo que pueda pedirle.

O hazlo tú mismo:

npx shadcn@latest mcp init --client claude

Bueno saber

Ejecuta el comando init dentro de tu proyecto, reinicia Claude Code y revisa el servidor con /mcp. shadcn documenta el mismo comando para Cursor, VS Code, Codex y OpenCode (--client cursor, vscode, codex u opencode); para Codex solo imprime las líneas que debes agregar a ~/.codex/config.toml, porque la CLI no puede editar ese archivo.

Desbloquea los pasos de configuración

Gratis. Deja tu email una vez para abrir los pasos de configuración de los 152 servidores y recibir cada mes los mejores conectores nuevos.

Sin spam. Te das de baja con un clic. Usamos tu correo para enviarte el curso y consejos de IA.

Cómo lo verificamos

Revisamos la documentación MCP y el changelog de shadcn/ui (el servidor MCP llegó con la CLI 3.0 en agosto de 2025), el repo shadcn-ui/ui (MIT, 126.6k estrellas, commits hasta el 2026-10-26) y el paquete npm shadcn (4.22.1). El 2026-10-27 ejecutamos npx shadcn@latest mcp init --client claude en una carpeta de prueba vacía: escribió .mcp.json y agregó shadcn como dependencia de desarrollo. Luego iniciamos el servidor, que listó 7 herramientas, y una búsqueda de un formulario de login en el registro @shadcn devolvió dos bloques de login con sus comandos para agregarlos. Todavía no lo usamos dentro de Claude Code.

Fuente: ui.shadcn.com/docs/mcp

shadcn MCP: preguntas frecuentes

¿Con qué herramientas de IA funciona el servidor MCP de shadcn?

La documentación de shadcn da una configuración de un solo comando para Claude Code, Cursor, VS Code con GitHub Copilot, Codex y OpenCode: ejecuta npx shadcn@latest mcp init en tu proyecto con --client claude, cursor, vscode, codex u opencode. Para Codex también agregas el servidor a mano en ~/.codex/config.toml, porque la CLI de shadcn no puede editar ese archivo. Cualquier otro cliente MCP puede ejecutar el mismo comando: npx con los argumentos shadcn@latest y mcp.

¿Necesito una cuenta o una clave de API?

No. El registro estándar de shadcn/ui no necesita ninguna configuración. Solo los registros privados que piden inicio de sesión necesitan un token, que guardas en una variable de entorno en .env.local y pasas en los headers del registro en components.json.

¿Puede usar los componentes de mi empresa?

Sí. Funciona con cualquier registro que siga la especificación de registros de shadcn: el registro predeterminado de shadcn/ui, registros de terceros y bibliotecas privadas de empresa. Agrega cada uno a la sección registries de components.json con un namespace como @internal y luego pide elementos por nombre, por ejemplo @internal/auth-form.

¿Qué hago si mi herramienta de IA muestra No tools or prompts para shadcn?

Los pasos de solución de problemas de shadcn: limpia la caché de npx con npx clear-npx-cache, desactiva y vuelve a activar el servidor MCP en tu herramienta de IA y revisa sus logs (en Cursor, View > Output y luego MCP: project-* en el desplegable). Si los componentes no se instalan, comprueba que tu proyecto tenga un components.json válido y que existan las carpetas de destino.

Escribimos estas respuestas a partir de las páginas oficiales de cada producto mencionado, consultadas el 27 de octubre de 2026.

Más servidores para desarrolladores