# Gradiently Claude-connector: ontwerpen met MCP in Claude

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

Claude kan Marks zoeken, je huisstijl lezen en echte, bewerkbare ontwerpen bouwen in je workspace. Er zijn twee manieren: een connector met inloggen of een afgebakende sleutel. Deze pagina behandelt beide.

## The short version

- Gradiently draait een gehoste MCP-server voor Claude op https://gradiently.design/api/mcp.
- In de Claude-app wordt Gradiently toegevoegd als eigen connector met inloggen via OAuth; in Claude Code voeg je het toe met een afgebakende API-sleutel uit Instellingen › API en agents.
- Een nieuwe API-sleutel begint met de rechten die elke ontwerptool nodig heeft, en Marks claimen blijft uit tenzij je het kiest.
- Als Claude een ontwerp opmaakt met de tools van Gradiently, kost dat geen AI-credits van Gradiently en elk opgeslagen ontwerp opent in de Studio.
- Een sleutel werkt alleen in de workspace die hem heeft uitgegeven, handelt als de eigenaar of beheerder die hem maakte en kan direct worden ingetrokken.

Om de **Gradiently Claude**-connector in te stellen, wijs je Claude naar de gehoste MCP-server van Gradiently op `https://gradiently.design/api/mcp`. Voeg hem in de Claude-app toe als eigen connector en log in bij Gradiently. In Claude Code voeg je hem toe vanuit de terminal met een afgebakende API-sleutel. Hoe dan ook kan Claude daarna Marks zoeken, je merkkit lezen en ontwerpen maken die in je workspace worden opgeslagen en in de Studio openen, met elk woord nog bewerkbaar.

MCP, het Model Context Protocol, is de open standaard waarmee Claude echte tools kan gebruiken. [Wat is MCP](https://gradiently.design/nl/guide/what-is-mcp) legt het eenvoudig uit en het protocol zelf is gedocumenteerd op [modelcontextprotocol.io](https://modelcontextprotocol.io).

## Op welke manier je Claude koppelt

| Waar je Claude gebruikt | Hoe het koppelt | Inloggen |
| --- | --- | --- |
| De Claude-app, op het web of desktop | Eigen connector | OAuth: log in bij Gradiently, kies een workspace |
| Claude Code in je terminal | Remote MCP-server via HTTP | Een afgebakende API-sleutel in de Authorization-header |
| Andere MCP-clients | Remote server met een eigen header | Een afgebakende API-sleutel |

Dezelfde server, dezelfde tools, dezelfde rechten. Alleen de manier waarop Claude bewijst wie het is, verschilt.

Welke route je ook neemt, je moet **eigenaar of beheerder** zijn van de Gradiently-workspace. Bewerkers en kijkers kunnen geen assistenten koppelen of sleutels maken.

## De Claude-app koppelen met een eigen connector

1. **Open de connectorinstellingen van Claude** Voeg een eigen connector toe. Welke Claude-abonnementen eigen connectors toestaan bepaalt Anthropic, dus kijk op de helppagina’s van Claude als je de optie niet ziet. [Claude-connectors](https://gradiently.design/nl/guide/claude-connectors) legt de functie uit.
2. **Plak het serveradres** Noem hem Gradiently en gebruik `https://gradiently.design/api/mcp`. Kies inloggen via OAuth.
3. **Log in en kies een workspace** Kies in het Gradiently-venster de workspace waarin Claude moet werken en lees de rechten onder **Sta deze assistent toe om**.
4. **Sta toe en controleer** Kies **Verbinding toestaan**. Vraag Claude terug in de app zijn Gradiently-tools op te sommen om het te bevestigen.

Toegang wordt tot 30 dagen automatisch vernieuwd, daarna koppel je opnieuw. Een eigen connector is meteen voor jou te gebruiken; een vermelding in de openbare map van Claude is iets anders en vereist beoordeling door Anthropic.

## Claude Code koppelen met een afgebakende API-sleutel

Claude Code gebruikt een sleutel in plaats van inloggen. Maak er een in Gradiently onder **Instellingen › API en agents**: kies de workspace, noem hem naar waar hij staat (*Claude Code, laptop*), vink aan wat hij mag doen en kies **Sleutel maken**. De sleutel wordt één keer getoond, dus kopieer hem meteen naar je wachtwoordmanager.

```bash
export GRADIENTLY_API_KEY="gr_live_…"

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

Bewaar de sleutel in een omgevingsvariabele, zodat hij nooit in je shellgeschiedenis of een gecommit bestand terechtkomt. Begin een nieuwe sessie en vraag Claude de tools van Gradiently op te sommen.

Andere clients die een JSON-bestand lezen accepteren meestal dezelfde server en header. Instellingen toont een kant-en-klaar fragment onder **Een MCP-client koppelen**.

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

De JSON-vorm die veel MCP-clients accepteren. Controleer de eigen documentatie van je client voor het exacte formaat.

## De rechten van de sleutel kiezen

Elk recht is een scope. Een nieuwe sleutel begint met vijf rechten die alle ontwerptools dekken, dus de meeste mensen hoeven niets te wijzigen. Voeg de andere alleen toe als Claude ze echt nodig heeft.

| Recht in Instellingen | Standaard aan | Wat het toestaat |
| --- | --- | --- |
| Ontwerpen lezen | Ja | Merken, ontwerpen en uploads lezen en ontwerpen renderen |
| Ontwerpen maken en bewerken | Ja | Ontwerpen maken, wijzigen en aanpassen van formaat, afbeeldingen uploaden, de Designer laten werken |
| Marks zoeken | Ja | De Markt doorzoeken en elke openbare Mark lezen |
| De workspace lezen | Ja | De workspace en haar leden lezen |
| Merken genereren | Ja | Merkrichtingen genereren op basis van een naam en beschrijving |
| Merken bewerken | Nee | Het profiel en de Mark van een merk wijzigen, merken maken |
| Marks claimen | Nee | Een beschikbare Mark claimen voor de maker van de sleutel |
| Leden uitnodigen | Nee | Uitnodigingen sturen om lid te worden van de workspace |

Geef alleen wat de klus nodig heeft. De scopes van een sleutel kunnen later niet worden gewijzigd, dus maak een nieuwe sleutel als de klus verandert.

## Wat Claude kan doen zodra het is gekoppeld

Claude werkt via dezelfde acties die jij in het product hebt. Het kan de Markt doorzoeken op naam, kleurwoorden of code; je merkprofiel, toon en lettertypen lezen; een origineel ontwerp tekenen, de gerenderde afbeelding bekijken en verfijnen; een van de sjablonen van Gradiently invullen; de woorden op een opgeslagen ontwerp wijzigen; formaatkopieën maken; en een ontwerp renderen naar PNG of PDF. Als Claude het ontwerp zelf opmaakt, rekent Gradiently **geen AI-credits**. Als je vraagt de klus aan de eigen Designer van Gradiently te geven, gebruikt dat credits zoals in de Studio.

Claude Code maakt een bepaald soort klus makkelijk. Stel dat je een blog bijhoudt en voor elke post een linkafbeelding wilt. Vraag: *“Maak voor elke post in /content een linkpreview van 1200×630 in onze huisstijl met de titel van de post en render ze dan elk als PNG naar /public/og.”* Claude ontwerpt elke afbeelding in Gradiently, controleert hem en schrijft de bestanden waar je site ze verwacht. [Formaat van Open Graph-afbeeldingen](https://gradiently.design/nl/guide/open-graph-image-size) legt uit waarom 1200×630.

Een brede linkpreviewafbeelding voor een blog met de titel van een engineeringartikel op een verloopachtergrond

Een linkpreview van 1200×630, ontworpen via de Gradiently MCP-server en rechtstreeks gerenderd naar de map van een site.

> **Sta lange toolaanroepen toe** De meeste tools antwoorden binnen enkele seconden, maar een ontwerp renderen en inspecteren kan tot drie minuten duren en een klus voor de Designer tot ongeveer vijf. Heeft je client een instelling voor de time-out van tools, verhoog die dan.

## Prompts die goed werken met Claude

- *“Lees ons merkprofiel en maak dan een LinkedInpost en een X-post die ons nieuwe kantoor in Bristol aankondigen.”*
- *“Zoek drie donkere Marks met een zijden materiaal in de buurt van diep petrol en geef me hun codes.”*
- *“Neem de aankondiging van gisteren en maak er een story en een YouTube-thumbnail van.”*
- *“Verander de datum op de eventposter naar 14 november en render hem als PDF.”*

Hoe beter je merkkit, hoe minder je bij elk verzoek hoeft te zeggen; [merktoon voor AI](https://gradiently.design/nl/guide/brand-kit-voice) laat zien wat je invult. Voor meer ideeën gericht op socialmediaposts, zie [Claude voor social media](https://gradiently.design/nl/guide/claude-social-media-posts), en voor het grotere plaatje [ontwerpen met Claude](https://gradiently.design/nl/guide/design-with-claude).

## De verbinding veilig houden

### Een sleutel kan

- Werken in de ene workspace die hem heeft uitgegeven
- Doen wat de rol van zijn maker en zijn scopes toestaan
- Ontwerpen maken die bij de workspace horen
- Laten zien wanneer hij voor het laatst is gebruikt, in Instellingen

### Een sleutel kan nooit

- Een andere workspace bereiken, ook niet als je er lid van bent
- Ergens voor betalen of bij facturatie komen
- Een Mark overdragen, aanbieden of vrijgeven
- Andere sleutels maken of beheren

Lekt een sleutel of gebruik je hem niet meer, kies dan **Intrekken** ernaast in **Instellingen › API en agents** en hij werkt direct niet meer. Sleutels stoppen ook als hun maker de workspace verlaat of de beheerdersrol verliest. Gebruik je ook ChatGPT? [Gradiently in ChatGPT](https://gradiently.design/nl/guide/design-with-chatgpt-app) heeft een eigen installatie en de volledige toolreferentie staat in de [ontwikkelaarsdocs](https://gradiently.design/nl/developers/mcp).

## FAQ

### Wat is het adres van de Gradiently MCP-server voor Claude?

`https://gradiently.design/api/mcp`. Gebruik het in de Claude-app als eigen connector met OAuth; voeg het in Claude Code toe met je API-sleutel in de Authorization-header.

### Heb ik een API-sleutel nodig om Gradiently in Claude te gebruiken?

Niet in de Claude-app, die inlogt met OAuth. Claude Code en de meeste andere MCP-clients hebben een afgebakende sleutel nodig uit Instellingen › API en agents.

### Gebruikt Claude mijn AI-credits van Gradiently?

Niet als het zelf ontwerpen opmaakt met de tools van Gradiently. Een klus aan de eigen Designer van Gradiently geven gebruikt wel credits.

### Kan Claude een Mark voor me claimen?

Alleen met een sleutel die het recht Marks claimen heeft, dat standaard uit staat. Elke claim waarvoor betaling nodig is, moet nog steeds in Gradiently worden afgerond.

### Waarom zegt Claude dat het niet kan authenticeren?

De sleutel is verkeerd getypt of ingetrokken, of de maker ervan is geen eigenaar of beheerder van de workspace meer. Maak een nieuwe sleutel en werk je client bij.