DocumentaciónIntegraciones

Conecta 21st.dev con tu propia clave API

Busca componentes de interfaz e inspiración de diseño a través del MCP oficial de 21st con tu propia cuenta de 21st.dev.

3 min de lecturaActualizado el

Qué puedes usar

21st ofrece búsqueda de componentes, plantillas de diseño y recuperación de código. Las herramientas disponibles dependen de tu cuenta. La generación con IA también requiere el acceso de 21st correspondiente y puede consumir créditos.

Conecta desde el catálogo

  1. 01Crea una clave API actual en tu cuenta en https://21st.dev/mcp.
  2. 02Abre Apps > Conectores, busca 21st.dev y elige Conectar.
  3. 03Pega tu clave. La dirección del servidor y la cabecera x-api-key ya están configuradas.
  4. 04Prueba la conexión y guárdala. También puedes usarla en pasos de workflow.

Usa tu propia clave. El uso y la facturación se gestionan en tu cuenta de 21st.dev. Las antiguas claves de Magic se han restablecido y debes crear otras nuevas.

También puedes importar JSON

Puedes importar la misma conexión como MCP personalizado. El formato estándar mcpServers también funciona dentro de un bloque de código JSON. Sustituye el marcador por tu propia clave.

{
  "mcpServers": {
    "21st": {
      "url": "https://21st.dev/api/mcp",
      "headers": {
        "x-api-key": "YOUR_21ST_API_KEY"
      }
    }
  }
}
  1. 01Añade un MCP personalizado y elige Importar JSON.
  2. 02Pega la configuración y elige Leer configuración.
  3. 03Revisa los datos detectados y aplícalos al formulario.
  4. 04Comprueba tu clave, prueba la conexión y guarda. Este servidor alojado no necesita un paquete npx.

Acceso y herramientas

El servidor remoto proporciona la lista de herramientas. Por eso, la conexión no se limita a la lectura. Revisa las acciones de escritura y la generación de pago antes de autorizarlas. Tu cuenta de 21st determina las funciones disponibles.

Configuración oficial