# Gradiently in Claude: mit MCP direkt in Claude gestalten

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

Claude kann Marks suchen, deine Marke lesen und echte, bearbeitbare Designs in deinem Arbeitsbereich bauen. Es gibt zwei Wege hinein, einen Connector mit Anmeldung oder einen eingeschränkten Schlüssel, und diese Seite behandelt beide.

## The short version

- Gradiently betreibt für Claude einen gehosteten MCP-Server unter https://gradiently.design/api/mcp.
- In der Claude App wird Gradiently als benutzerdefinierter Connector mit Anmeldung per OAuth hinzugefügt; in Claude Code mit einem eingeschränkten API-Schlüssel aus Einstellungen › API und Agenten.
- Ein neuer API-Schlüssel startet mit den Berechtigungen, die jedes Designwerkzeug braucht, und Marks sichern bleibt aus, solange du es nicht wählst.
- Wenn Claude ein Design mit den Werkzeugen von Gradiently gestaltet, verbraucht es keine KI-Credits von Gradiently, und jedes gespeicherte Design öffnet sich im Studio.
- Ein Schlüssel funktioniert immer nur in dem Arbeitsbereich, der ihn ausgestellt hat, handelt als der Inhaber oder Admin, der ihn erstellt hat, und lässt sich sofort widerrufen.

Um den **Gradiently-Connector für Claude** einzurichten, verweist du Claude auf den gehosteten MCP-Server von Gradiently unter `https://gradiently.design/api/mcp`. In der Claude App fügst du ihn als benutzerdefinierten Connector hinzu und meldest dich bei Gradiently an. In Claude Code fügst du ihn im Terminal mit einem eingeschränkten API-Schlüssel hinzu. So oder so kann Claude dann Marks suchen, dein Markenkit lesen und Designs erstellen, die in deinem Arbeitsbereich gespeichert werden und sich im Studio öffnen, mit jedem Wort weiterhin bearbeitbar.

MCP, das Model Context Protocol, ist der offene Standard, mit dem Claude echte Werkzeuge nutzt. [Was ist MCP](https://gradiently.design/de/guide/what-is-mcp) erklärt es einfach, und das Protokoll selbst ist unter [modelcontextprotocol.io](https://modelcontextprotocol.io) dokumentiert.

## Auf welchem Weg du Claude verbindest

| Wo du Claude nutzt | Wie es sich verbindet | Anmeldung |
| --- | --- | --- |
| Die Claude App, im Web oder auf dem Desktop | Benutzerdefinierter Connector | OAuth: bei Gradiently anmelden, Arbeitsbereich wählen |
| Claude Code in deinem Terminal | Remote-MCP-Server über HTTP | Ein eingeschränkter API-Schlüssel im Authorization-Header |
| Andere MCP-Clients | Remote-Server mit eigenem Header | Ein eingeschränkter API-Schlüssel |

Derselbe Server, dieselben Werkzeuge, dieselben Berechtigungen. Nur die Art, wie Claude sich ausweist, unterscheidet sich.

Welchen Weg du auch nimmst, du musst **Inhaber oder Admin** des Gradiently-Arbeitsbereichs sein. Bearbeiter und Betrachter können keine Assistenten verbinden und keine Schlüssel erstellen.

## Die Claude App mit einem benutzerdefinierten Connector verbinden

1. **Die Connector-Einstellungen von Claude öffnen** Füge einen benutzerdefinierten Connector hinzu. Welche Claude-Tarife benutzerdefinierte Connectors erlauben, entscheidet Anthropic, also sieh in den Hilfeseiten von Claude nach, wenn du die Option nicht siehst. [Claude-Connectors](https://gradiently.design/de/guide/claude-connectors) erklärt die Funktion.
2. **Die Serveradresse einfügen** Nenne ihn Gradiently und nutze `https://gradiently.design/api/mcp`. Wähle die Anmeldung per OAuth.
3. **Anmelden und Arbeitsbereich wählen** Wähle im Gradiently-Fenster den Arbeitsbereich, in dem Claude arbeiten soll, und lies die Berechtigungen unter **Diesem Assistenten erlauben**.
4. **Erlauben, dann prüfen** Wähle **Verbindung erlauben**. Zurück in Claude bittest du es zur Bestätigung, seine Gradiently-Werkzeuge aufzulisten.

Der Zugriff erneuert sich automatisch für bis zu 30 Tage, dann verbindest du neu. Einen benutzerdefinierten Connector kannst du sofort nutzen; ein Eintrag im öffentlichen Verzeichnis von Claude ist etwas anderes und braucht eine Prüfung durch Anthropic.

## Claude Code mit einem eingeschränkten API-Schlüssel verbinden

Claude Code nutzt einen Schlüssel statt einer Anmeldung. Erstelle einen in Gradiently unter **Einstellungen › API und Agenten**: Wähle den Arbeitsbereich, benenne ihn nach dem Ort, an dem er lebt (*Claude Code, Laptop*), hake an, was er tun darf, und wähle **Schlüssel erstellen**. Der Schlüssel wird nur einmal angezeigt, also kopiere ihn sofort in deinen Passwortmanager.

```bash
export GRADIENTLY_API_KEY="gr_live_…"

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

Halte den Schlüssel in einer Umgebungsvariablen, damit er nie in deinem Shell-Verlauf oder einer eingecheckten Datei landet. Starte eine neue Sitzung und bitte Claude, die Werkzeuge von Gradiently aufzulisten.

Andere Clients, die eine JSON-Datei lesen, akzeptieren meist denselben Server und Header. Die Einstellungen zeigen unter **Einen MCP-Client verbinden** ein fertiges Snippet.

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

Die JSON-Form, die viele MCP-Clients akzeptieren. Das genaue Format steht in der Dokumentation deines Clients.

## Die Berechtigungen des Schlüssels wählen

Jede Berechtigung ist ein Scope. Ein neuer Schlüssel startet mit fünf, die jedes Designwerkzeug abdecken, sodass die meisten nichts ändern. Füge die anderen nur hinzu, wenn Claude sie wirklich braucht.

| Berechtigung in den Einstellungen | Standardmäßig an | Was sie erlaubt |
| --- | --- | --- |
| Designs lesen | Ja | Marken, Designs und Uploads lesen und Designs rendern |
| Designs erstellen und bearbeiten | Ja | Designs erstellen, ändern und in andere Formate bringen, Bilder hochladen, den Designer ausführen |
| Marks suchen | Ja | Den Markt durchsuchen und jeden öffentlichen Mark lesen |
| Arbeitsbereich lesen | Ja | Den Arbeitsbereich und seine Mitglieder lesen |
| Marken generieren | Ja | Markenrichtungen aus einem Namen und einer Beschreibung erzeugen |
| Marken bearbeiten | Nein | Profil und Mark einer Marke ändern, Marken anlegen |
| Marks sichern | Nein | Einen verfügbaren Mark für die Person sichern, die den Schlüssel erstellt hat |
| Mitglieder einladen | Nein | Einladungen zum Arbeitsbereich verschicken |

Gib nur, was die Aufgabe braucht. Die Scopes eines Schlüssels lassen sich später nicht ändern, also erstelle einen neuen Schlüssel, wenn sich die Aufgabe ändert.

## Was Claude nach dem Verbinden tun kann

Claude arbeitet über dieselben Aktionen, die du im Produkt hast. Es kann den Markt nach Name, Farbwörtern oder Code durchsuchen; dein Markenprofil, deine Stimme und deine Schriften lesen; ein eigenes Design zeichnen, das gerenderte Bild ansehen und es verfeinern; eine der Vorlagen von Gradiently ausfüllen; die Worte eines gespeicherten Designs ändern; Kopien in anderen Formaten erstellen; und ein Design als PNG oder PDF rendern. Gestaltet Claude das Design selbst, berechnet Gradiently **keine KI-Credits**. Bittest du es, die Aufgabe an den eigenen Designer von Gradiently zu übergeben, verbraucht das Credits wie im Studio.

Claude Code macht eine bestimmte Art von Aufgabe leicht. Angenommen, du führst einen Blog und willst für jeden Artikel ein Linkbild. Bitte: *„Mach für jeden Beitrag in /content eine Linkvorschau in 1200×630 in unserer Marke mit dem Titel des Beitrags und rendere jede als PNG nach /public/og.“* Claude gestaltet jedes Bild in Gradiently, prüft es und schreibt die Dateien dorthin, wo deine Website sie erwartet. [Open-Graph-Bildgröße](https://gradiently.design/de/guide/open-graph-image-size) erklärt, warum 1200×630.

Ein breites Linkvorschaubild für einen Blog mit dem Titel eines Technikartikels auf einem Verlaufshintergrund

Eine Linkvorschau in 1200×630, gestaltet über den MCP-Server von Gradiently und direkt in den Ordner einer Website gerendert.

> **Lange Werkzeugaufrufe zulassen** Die meisten Werkzeuge antworten in Sekunden, aber ein Design zu rendern und zu prüfen kann bis zu drei Minuten dauern, und eine an den Designer übergebene Aufgabe bis zu etwa fünf. Hat dein Client eine Zeitlimit-Einstellung für Werkzeuge, erhöhe sie.

## Prompts, die mit Claude gut funktionieren

- *„Lies unser Markenprofil und mach dann einen LinkedIn-Beitrag und einen X-Beitrag, die unser neues Büro in Bristol ankündigen.“*
- *„Finde drei dunkle Marks mit Seidenmaterial nahe an tiefem Petrol und gib mir ihre Codes.“*
- *„Nimm die Ankündigung von gestern und mach daraus eine Story und ein YouTube-Thumbnail.“*
- *„Ändere das Datum auf dem Veranstaltungsplakat auf den 14. November und rendere es als PDF.“*

Je besser dein Markenkit, desto weniger musst du in jeder Anfrage sagen; [Markenstimme für KI](https://gradiently.design/de/guide/brand-kit-voice) zeigt, was du ausfüllen solltest. Weitere Ideen für Social-Media-Beiträge findest du unter [Claude für Social Media](https://gradiently.design/de/guide/claude-social-media-posts), und für das große Ganze unter [Design mit Claude](https://gradiently.design/de/guide/design-with-claude).

## Die Verbindung sicher halten

### Ein Schlüssel kann

- In dem einen Arbeitsbereich arbeiten, der ihn ausgestellt hat
- Tun, was die Rolle seines Erstellers und seine Scopes erlauben
- Designs erstellen, die dem Arbeitsbereich gehören
- In den Einstellungen zeigen, wann er zuletzt genutzt wurde

### Ein Schlüssel kann niemals

- Einen anderen Arbeitsbereich erreichen, auch keinen, dem du angehörst
- Etwas bezahlen oder die Abrechnung erreichen
- Einen Mark übertragen, anbieten oder freigeben
- Andere Schlüssel erstellen oder verwalten

Wenn ein Schlüssel durchsickert oder du ihn nicht mehr nutzt, wähle **Widerrufen** daneben unter **Einstellungen › API und Agenten**, und er funktioniert sofort nicht mehr. Schlüssel enden auch, wenn ihr Ersteller den Arbeitsbereich verlässt oder die Admin-Rolle verliert. Nutzt du auch ChatGPT? [Gradiently in ChatGPT](https://gradiently.design/de/guide/design-with-chatgpt-app) hat eine eigene Einrichtung, und die vollständige Werkzeugreferenz steht in der [Entwicklerdokumentation](https://gradiently.design/de/developers/mcp).

## FAQ

### Wie lautet die Adresse des Gradiently-MCP-Servers für Claude?

`https://gradiently.design/api/mcp`. In der Claude App nutzt du sie als benutzerdefinierten Connector mit OAuth; in Claude Code fügst du sie mit deinem API-Schlüssel im Authorization-Header hinzu.

### Brauche ich einen API-Schlüssel, um Gradiently in Claude zu nutzen?

Nicht in der Claude App, die sich per OAuth anmeldet. Claude Code und die meisten anderen MCP-Clients brauchen einen eingeschränkten Schlüssel aus Einstellungen › API und Agenten.

### Verbraucht Claude meine KI-Credits von Gradiently?

Nicht, wenn es Designs selbst mit den Werkzeugen von Gradiently gestaltet. Eine Aufgabe an den eigenen Designer von Gradiently zu übergeben, verbraucht Credits.

### Kann Claude einen Mark für mich sichern?

Nur mit einem Schlüssel, der die Berechtigung Marks sichern hat, die standardmäßig aus ist. Jedes Sichern, das eine Zahlung braucht, muss trotzdem in Gradiently abgeschlossen werden.

### Warum sagt Claude, dass es sich nicht anmelden kann?

Der Schlüssel wurde falsch eingegeben oder widerrufen, oder sein Ersteller ist nicht mehr Inhaber oder Admin des Arbeitsbereichs. Erstelle einen neuen Schlüssel und aktualisiere deinen Client.