Connecteur Gradiently pour Claude : créer avec MCP dans Claude

Pour configurer le connecteur Gradiently Claude, pointez Claude vers le serveur MCP hébergé de Gradiently à l’adresse https://gradiently.design/api/mcp. Dans l’app Claude, ajoutez-le comme connecteur personnalisé et connectez-vous à Gradiently. Dans Claude Code, ajoutez-le depuis le terminal avec une clé API à portée limitée. Dans les deux cas, Claude peut ensuite chercher des Marks, lire votre kit de marque et créer des designs enregistrés dans votre espace de travail, qui s’ouvrent dans le Studio avec chaque mot encore modifiable.

MCP, le Model Context Protocol, est le standard ouvert qui permet à Claude d’utiliser de vrais outils. Qu’est-ce que MCP l’explique simplement, et le protocole lui-même est documenté sur modelcontextprotocol.io.

Quelle façon de connecter Claude

Quelle que soit la voie choisie, vous devez être propriétaire ou administrateur de l’espace de travail Gradiently. Les éditeurs et lecteurs ne peuvent ni connecter d’assistants ni créer de clés.

Connecter l’app Claude avec un connecteur personnalisé

1. 1

   Ouvrez les réglages des connecteurs de Claude

   Ajoutez un connecteur personnalisé. Les offres Claude qui autorisent les connecteurs personnalisés relèvent d’Anthropic : consultez l’aide de Claude si l’option n’apparaît pas. Les connecteurs Claude explique la fonction.

2. 2

   Collez l’adresse du serveur

   Nommez-le Gradiently et utilisez https://gradiently.design/api/mcp. Choisissez la connexion OAuth.

3. 3

   Connectez-vous et choisissez un espace de travail

   Dans la fenêtre Gradiently, choisissez l’espace de travail dans lequel Claude doit travailler et lisez les autorisations sous Autoriser cet assistant à.

4. 4

   Autorisez, puis vérifiez

   Choisissez Autoriser la connexion. De retour dans Claude, demandez-lui de lister ses outils Gradiently pour confirmer.

L’accès se renouvelle automatiquement pendant 30 jours au plus, puis vous vous reconnectez. Un connecteur personnalisé est utilisable tout de suite ; une fiche dans l’annuaire public de Claude est une autre affaire et demande un examen par Anthropic.

Connecter Claude Code avec une clé API à portée limitée

Claude Code utilise une clé plutôt qu’une connexion. Créez-en une dans Gradiently sous Paramètres › API et agents : choisissez l’espace de travail, nommez-la d’après l’endroit où elle sera utilisée (Claude Code, portable), cochez ce qu’elle peut faire et sélectionnez Créer la clé. La clé ne s’affiche qu’une fois : copiez-la tout de suite dans votre gestionnaire de mots de passe.

export GRADIENTLY_API_KEY="gr_live_…"

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

Les autres clients qui lisent un fichier JSON acceptent en général le même serveur et le même en-tête. Les Paramètres proposent un extrait prêt à l’emploi sous Connecter un client MCP.

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

Choisir les autorisations de la clé

Chaque autorisation est une portée. Une nouvelle clé démarre avec cinq portées qui couvrent tous les outils de design, si bien que la plupart des gens ne changent rien. N’ajoutez les autres que lorsque Claude en a vraiment besoin.

Ce que Claude peut faire une fois connecté

Claude passe par les mêmes actions que vous dans le produit. Il peut chercher dans le Marché par nom, mots de couleur ou code ; lire le profil, le ton et les polices de votre marque ; dessiner un design original, regarder l’image rendue et l’affiner ; remplir l’un des modèles de Gradiently ; changer le texte d’un design enregistré ; faire des copies redimensionnées ; et exporter un design en PNG ou en PDF. Quand Claude compose le design lui-même, Gradiently ne facture aucun crédit IA. Si vous lui demandez de confier le travail au Designer de Gradiently, cela consomme des crédits comme dans le Studio.

Claude Code rend un certain type de travail très simple. Disons que vous tenez un blog et voulez une image de lien pour chaque article. Demandez : « Pour chaque article dans /content, crée un aperçu de lien en 1200×630 à notre marque avec le titre de l’article, puis exporte chacun en PNG dans /public/og. » Claude crée chaque image dans Gradiently, la vérifie et écrit les fichiers là où votre site les attend. La taille des images Open Graph explique pourquoi 1200×630.

Des prompts qui fonctionnent bien avec Claude

• « Lis le profil de notre marque, puis crée un post LinkedIn et un post X annonçant notre nouveau bureau à Bristol. »
• « Trouve trois Marks sombres en matière soie proches du sarcelle profond et donne-moi leurs codes. »
• « Reprends l’annonce d’hier et fais-en une story et une miniature YouTube. »
• « Change la date de l’affiche de l’événement pour le 14 novembre et exporte-la en PDF. »

Plus votre kit de marque est complet, moins vous avez à préciser dans chaque demande ; le ton de marque pour l’IA montre quoi remplir. Pour d’autres idées orientées réseaux sociaux, voyez Claude pour les réseaux sociaux, et pour la vue d’ensemble, le design avec Claude.

Garder la connexion sûre

Si une clé fuite ou que vous ne l’utilisez plus, sélectionnez Révoquer à côté d’elle dans Paramètres › API et agents et elle cesse de fonctionner aussitôt. Les clés s’arrêtent aussi quand leur créateur quitte l’espace de travail ou perd son rôle d’administrateur. Vous utilisez aussi ChatGPT ? Gradiently dans ChatGPT a sa propre configuration, et la référence complète des outils se trouve dans la documentation développeurs.