# Conector de Gradiently para Claude: diseña con MCP en Claude

[Canonical HTML page](https://gradiently.design/es/guide/design-with-claude-connector)

Claude puede buscar Marks, leer tu marca y crear diseños reales y editables en tu espacio de trabajo. Hay dos formas de entrar, un conector con inicio de sesión o una clave limitada, y esta página explica las dos.

## The short version

- Gradiently ofrece un servidor MCP alojado para Claude en https://gradiently.design/api/mcp.
- En la app de Claude, Gradiently se añade como conector personalizado con inicio de sesión OAuth; en Claude Code, se añade con una clave de API limitada de Ajustes › API y agentes.
- Una clave nueva empieza con los permisos que necesita cualquier herramienta de diseño, y Reservar Marks queda desactivado salvo que lo elijas.
- Cuando Claude compone un diseño con las herramientas de Gradiently no gasta créditos de IA de Gradiently, y cada diseño guardado se abre en el Studio.
- Una clave solo funciona en el espacio de trabajo que la emitió, actúa como el propietario o administrador que la creó y puede revocarse al instante.

Para configurar el conector de **Gradiently para Claude**, apunta Claude al servidor MCP alojado de Gradiently en `https://gradiently.design/api/mcp`. En la app de Claude, añádelo como conector personalizado e inicia sesión en Gradiently. En Claude Code, añádelo desde el terminal con una clave de API limitada. En ambos casos Claude podrá buscar Marks, leer tu kit de marca y crear diseños que se guardan en tu espacio de trabajo y se abren en el Studio, con todas las palabras editables.

MCP, el Model Context Protocol, es el estándar abierto que permite a Claude usar herramientas reales. [Qué es MCP](https://gradiently.design/es/guide/what-is-mcp) lo explica de forma sencilla, y el propio protocolo está documentado en [modelcontextprotocol.io](https://modelcontextprotocol.io).

## De qué forma conectar Claude

| Dónde usas Claude | Cómo se conecta | Inicio de sesión |
| --- | --- | --- |
| La app de Claude, en la web o en el escritorio | Conector personalizado | OAuth: inicia sesión en Gradiently y elige un espacio de trabajo |
| Claude Code en tu terminal | Servidor MCP remoto por HTTP | Una clave de API limitada en la cabecera Authorization |
| Otros clientes MCP | Servidor remoto con una cabecera personalizada | Una clave de API limitada |

El mismo servidor, las mismas herramientas, los mismos permisos. Solo cambia cómo demuestra Claude quién es.

Elijas la vía que elijas, tienes que ser **propietario o administrador** del espacio de trabajo de Gradiently. Los editores y lectores no pueden conectar asistentes ni crear claves.

## Conectar la app de Claude con un conector personalizado

1. **Abre los ajustes de conectores de Claude** Añade un conector personalizado. Qué planes de Claude permiten conectores personalizados lo decide Anthropic, así que consulta la ayuda de Claude si no ves la opción. [Conectores de Claude](https://gradiently.design/es/guide/claude-connectors) explica la función.
2. **Pega la dirección del servidor** Llámalo Gradiently y usa `https://gradiently.design/api/mcp`. Elige el inicio de sesión OAuth.
3. **Inicia sesión y elige un espacio de trabajo** En la ventana de Gradiently, elige el espacio de trabajo en el que debe trabajar Claude y lee los permisos en **Permitir que este asistente pueda**.
4. **Permite y comprueba** Elige **Permitir conexión**. De vuelta en Claude, pídele que enumere sus herramientas de Gradiently para confirmarlo.

El acceso se renueva automáticamente durante un máximo de 30 días y luego vuelves a conectar. Un conector personalizado puedes usarlo al momento; aparecer en el directorio público de Claude es otra cosa y necesita la revisión de Anthropic.

## Conectar Claude Code con una clave de API limitada

Claude Code usa una clave en lugar de iniciar sesión. Crea una en Gradiently en **Ajustes › API y agentes**: elige el espacio de trabajo, ponle el nombre del lugar donde vivirá (*Claude Code, portátil*), marca lo que puede hacer y selecciona **Crear clave**. La clave se muestra una sola vez, así que cópiala enseguida en tu gestor de contraseñas.

```bash
export GRADIENTLY_API_KEY="gr_live_…"

claude mcp add --transport http gradiently https://gradiently.design/api/mcp \
  --header "Authorization: Bearer $GRADIENTLY_API_KEY"
```

Guarda la clave en una variable de entorno para que nunca acabe en el historial de tu terminal ni en un archivo subido al repositorio. Empieza una sesión nueva y pide a Claude que enumere las herramientas de Gradiently.

Otros clientes que leen un archivo JSON suelen aceptar el mismo servidor y la misma cabecera. Ajustes muestra un fragmento listo en **Conectar un cliente MCP**.

```json
{
  "mcpServers": {
    "gradiently": {
      "url": "https://gradiently.design/api/mcp",
      "headers": { "Authorization": "Bearer gr_live_…" }
    }
  }
}
```

La estructura JSON que aceptan muchos clientes MCP. Consulta la documentación de tu cliente para su formato exacto.

## Elegir los permisos de la clave

Cada permiso es un ámbito. Una clave nueva empieza con cinco que cubren todas las herramientas de diseño, así que la mayoría de la gente no cambia nada. Añade los demás solo cuando Claude de verdad los necesite.

| Permiso en Ajustes | Activado por defecto | Qué permite |
| --- | --- | --- |
| Leer diseños | Sí | Leer marcas, diseños y archivos subidos, y renderizar diseños |
| Crear y editar diseños | Sí | Crear, cambiar y redimensionar diseños, subir imágenes, usar el Designer |
| Buscar Marks | Sí | Buscar en el Mercado y leer cualquier Mark público |
| Leer el espacio de trabajo | Sí | Leer el espacio de trabajo y sus miembros |
| Generar marcas | Sí | Generar direcciones de marca a partir de un nombre y una descripción |
| Editar marcas | No | Cambiar el perfil y el Mark de una marca, crear marcas |
| Reservar Marks | No | Reservar un Mark disponible para quien creó la clave |
| Invitar miembros | No | Enviar invitaciones para unirse al espacio de trabajo |

Concede solo lo que el trabajo necesita. Los ámbitos de una clave no pueden cambiarse después, así que crea una clave nueva si cambia el trabajo.

## Qué puede hacer Claude una vez conectado

Claude trabaja con las mismas acciones que tienes en el producto. Puede buscar en el Mercado por nombre, palabras de color o código; leer el perfil, el tono y las fuentes de tu marca; dibujar un diseño original, mirar la imagen renderizada y refinarla; rellenar una de las plantillas de Gradiently; cambiar el texto de un diseño guardado; hacer copias redimensionadas; y renderizar un diseño a PNG o PDF. Cuando Claude compone el diseño por sí mismo, Gradiently **no cobra créditos de IA**. Si le pides que pase el trabajo al Designer de Gradiently, eso usa créditos como lo haría en el Studio.

Claude Code facilita un tipo de trabajo concreto. Imagina que tienes un blog y quieres una imagen de enlace para cada artículo. Pide: *«Para cada artículo de /content, haz una vista previa de enlace de 1200×630 con nuestra marca y el título del artículo, y renderiza cada una como PNG en /public/og»*. Claude diseña cada imagen en Gradiently, la revisa y escribe los archivos donde tu sitio los espera. [Tamaño de imagen Open Graph](https://gradiently.design/es/guide/open-graph-image-size) explica por qué 1200×630.

Una imagen horizontal de vista previa de enlace de blog con el título de un artículo de ingeniería sobre un fondo degradado

Una vista previa de enlace de 1200×630 diseñada a través del servidor MCP de Gradiently y renderizada directamente en la carpeta de un sitio.

> **Permite llamadas largas a herramientas** La mayoría de las herramientas responden en segundos, pero renderizar y revisar un diseño puede tardar hasta tres minutos, y un trabajo pasado al Designer hasta unos cinco. Si tu cliente tiene un ajuste de tiempo de espera para herramientas, súbelo.

## Prompts que funcionan bien con Claude

- *«Lee el perfil de nuestra marca y haz una publicación de LinkedIn y otra de X anunciando nuestra nueva oficina en Bristol»*.
- *«Busca tres Marks oscuros con material de seda cercanos a un verde azulado profundo y dame sus códigos»*.
- *«Toma el anuncio de ayer y haz a partir de él una historia y una miniatura de YouTube»*.
- *«Cambia la fecha del cartel del evento al 14 de noviembre y renderízalo como PDF»*.

Cuanto mejor sea tu kit de marca, menos tendrás que decir en cada petición; [tono de marca para la IA](https://gradiently.design/es/guide/brand-kit-voice) muestra qué rellenar. Para más ideas centradas en publicaciones para redes, mira [Claude para redes sociales](https://gradiently.design/es/guide/claude-social-media-posts), y para la visión general, [diseño con Claude](https://gradiently.design/es/guide/design-with-claude).

## Mantener segura la conexión

### Una clave puede

- Funcionar en el único espacio de trabajo que la emitió
- Hacer lo que permitan el rol de su creador y sus ámbitos
- Crear diseños que pertenecen al espacio de trabajo
- Mostrar en Ajustes cuándo se usó por última vez

### Una clave nunca puede

- Acceder a otro espacio de trabajo, aunque pertenezcas a él
- Pagar nada ni acceder a la facturación
- Transferir, poner a la venta o liberar un Mark
- Crear ni gestionar otras claves

Si una clave se filtra o dejas de usarla, selecciona **Revocar** junto a ella en **Ajustes › API y agentes** y dejará de funcionar al instante. Las claves también dejan de funcionar cuando su creador sale del espacio de trabajo o pierde el rol de administrador. ¿También usas ChatGPT? [Gradiently en ChatGPT](https://gradiently.design/es/guide/design-with-chatgpt-app) tiene su propia configuración, y la referencia completa de herramientas está en la [documentación para desarrolladores](https://gradiently.design/es/developers/mcp).

## FAQ

### ¿Cuál es la dirección del servidor MCP de Gradiently para Claude?

`https://gradiently.design/api/mcp`. En la app de Claude úsala como conector personalizado con OAuth; en Claude Code, añádela con tu clave de API en la cabecera Authorization.

### ¿Necesito una clave de API para usar Gradiently en Claude?

En la app de Claude no, porque inicia sesión con OAuth. Claude Code y la mayoría de los demás clientes MCP necesitan una clave limitada de Ajustes › API y agentes.

### ¿Claude gasta mis créditos de IA de Gradiently?

No cuando compone diseños por sí mismo con las herramientas de Gradiently. Pasar un trabajo al Designer de Gradiently sí usa créditos.

### ¿Puede Claude reservar un Mark por mí?

Solo con una clave que tenga el permiso Reservar Marks, desactivado por defecto. Cualquier reserva que requiera pago tiene que terminarse en Gradiently.

### ¿Por qué Claude dice que no puede autenticarse?

La clave se escribió mal o se revocó, o su creador ya no es propietario o administrador del espacio de trabajo. Crea una clave nueva y actualiza tu cliente.