1 estrella en GitHub = 1 componente nuevo.

Dar una estrella
Servidor MCP Oficial · Astro 5.x

Potencia tu IA con Astro Components Kit

Conecta Cursor, Claude, Codex, Lovable o cualquier cliente MCP directamente a más de 340 componentes de producción, gráficos SVG y plantillas completas. Deja que tu IA construya webs Astro a toda velocidad.

340+
Componentes
41
Gráficos SVG
3
Plantillas
0
Dependencias
Endpoint SSE Remoto
https://mcp.astrocomponents.dev/sse

Configuración en 1 Clic para tu Editor o Agente

Elige tu herramienta de IA para obtener el comando de instalación automática por CLI o el JSON directo.

1

Instalación Automática por CLI

Runs automatically and configures your project file.

npx astro-component-kit mcp install cursor
2

Archivo de Configuración Directo

Or paste this directly into .cursor/mcp.json

{
  "mcpServers": {
    "astro-components": {
      "url": "https://mcp.astrocomponents.dev/sse"
    }
  }
}
1

Instalación Automática por CLI

Runs automatically and configures your project file.

npx astro-component-kit mcp install claude

Or for Claude Code CLI:

claude mcp add astro-components https://mcp.astrocomponents.dev/sse
2

Archivo de Configuración Directo

Or paste this directly into claude_desktop_config.json

{
  "mcpServers": {
    "astro-components": {
      "url": "https://mcp.astrocomponents.dev/sse"
    }
  }
}
1

Instalación Automática por CLI

Runs automatically and configures your project file.

npx astro-component-kit mcp install codex
2

Archivo de Configuración Directo

Or paste this directly into .codex/mcp.json

{
  "mcpServers": {
    "astro-components": {
      "url": "https://mcp.astrocomponents.dev/sse"
    }
  }
}
1

Instalación Automática por CLI

Runs automatically and configures your project file.

npx astro-component-kit mcp install lovable

Or for Lovable Settings URL:

https://mcp.astrocomponents.dev/sse
2

Archivo de Configuración Directo

Or paste this directly into .lovable/mcp.json

{
  "mcpServers": {
    "astro-components": {
      "url": "https://mcp.astrocomponents.dev/sse"
    }
  }
}
1

Instalación Automática por CLI

Runs automatically and configures your project file.

npx astro-component-kit mcp install mcp
2

Archivo de Configuración Directo

Or paste this directly into mcp.json

{
  "mcpServers": {
    "astro-components": {
      "url": "https://mcp.astrocomponents.dev/sse"
    }
  }
}

Prueba estos prompts en tu IA

Una vez conectado, tu asistente tendrá acceso inmediato al catálogo completo, interfaces TypeScript y código fuente.

E-commerce

“Añádeme un ProductBuyBox con selector de variantes y el carrito persistente CartDrawer de astro-components”

Charts & KPIs

“Inserta un KpiStatTile de ingresos con porcentaje de cambio y un gráfico LineChart en SVG sin dependencias”

SaaS App

“Crea la vista de habitaciones usando el RoomRack y el AppSidebar del template saas-hotel”

Design & Themes

“Configura el selector de tema claro y oscuro con los tokens adaptativos ink-rgb de global.css”

8 Herramientas MCP Integradas

Todo lo que tu asistente de IA necesita para descubrir, inspeccionar y generar código Astro listo para producción.

search_components

Búsqueda por palabras clave, categoría o tags entre los 340+ bloques

get_component

Obtiene Props, variantes, import syntax y guía de accesibilidad

get_component_code

Código fuente .astro completo listo para pegar en el proyecto

list_categories

Explora las 13 categorías disponibles con el conteo de componentes

list_templates

Resumen de las 3 plantillas multipágina completas en producción

get_template

Código, arquitectura y páginas de plantillas e-commerce y SaaS

get_design_tokens

Tokens CSS, variables de modo claro/oscuro y paleta unificada

get_library_info

Información general de la versión, totales y guía de inicio rápido

¡Copiado al portapapeles!