Intégration · Outils de développement

Connecter Claude et ChatGPT à Figma

Demandez à votre IA quelles sont les commentaires ouverts sur un design, ce qui a changé dans la dernière version, ou exportez une page en image depuis Figma. Elle lit les fichiers, pages, cadres et couches, commentaires et historique des versions, et liste les composants et styles de vos bibliothèques. Elle peut également poster et répondre aux commentaires, afin que les révisions de design puissent commencer dans le chat.

Connecter Figma gratuitement

Offre gratuite, sans carte bancaire. Comptez environ une minute.

Essayez de demander

“Résumez les commentaires ouverts sur le fichier de redesign du paiement.”
L'IA liste les commentaires du fichier avec l'auteur, le texte, les réponses et leur emplacement épinglé, puis résume ce qui reste en cours.
“Exporter le cadre Mobile / Accueil en PNG à 2x.”
Elle génère le cadre en PNG à l'échelle 2 et vous fournit un lien de téléchargement qui expire après 30 jours.
“Quels changements dans le fichier du paiement cette semaine ?”
Elle liste les versions sauvegardées avec leurs étiquettes, descriptions, auteurs et dates.

Ce que votre IA peut faire

Fichiers et couches

Lire les pages et cadres d'un fichier, récupérer des couches spécifiques par ID de nœud, et exporter des cadres ou des couches en images PNG.

Commentaires et versions

Lire les commentaires et réponses, poster et réagir aux commentaires, et voir l'historique des versions d'un fichier.

Bibliothèques et projets

Lister les composants et styles publiés, parcourir les projets et fichiers d'une équipe, et lire les liens développeurs sur les couches.

“Quels composants sont dans notre bibliothèque de système de design ?”
Elle liste les composants publiés dans le fichier de la bibliothèque avec leur nom et description.
“Répondre au commentaire d'Anna sur l'en-tête : corrigé dans la version 12.”
Elle poste votre réponse dans le même fil de commentaires, visible pour tous ayant accès au fichier.
“Lister les styles de texte et les couleurs dans la bibliothèque de marque.”
Elle liste les styles de couleur, texte, effet et grille publiés dans le fichier de la bibliothèque.

50 outils pour Figma

Ces outils sont activés lors de la connexion. Vous pouvez désactiver chacun d’eux ou exiger votre approbation avant son exécution.

create_dev_resourceModifie des données
create_developer_logModifie des données
create_document_variableModifie des données
create_webhookSupprime des données
delete_commentSupprime des donnéesSupprimer l'un de vos propres commentaires d'un fichier via son ID de commentaire (passé en `message_id`).
delete_comment_reactionsTransfère de l’argent
delete_document_dev_resourceSupprime des données
delete_webhookSupprime des données
export_imagesRendre des cadres ou couches en images PNG et obtenir des liens de téléchargement : `file_key`, séparés par des virgules nœud `ids`, et optionnel `scale` (0,01–4). Les liens expirent après 30 jours.
get_componentRécupérer un composant publié via son `component_key`, avec son nom, description, fichier et vignette.
get_component_set
get_current_userRécupérer le nom, l'adresse e-mail et l'identifiant utilisateur du compte connecté.
get_fileRécupérer l'arbre documentaire d'un fichier via sa clé de fichier (passée en `document_key`). Utilisez un petit `depth` (ex: 2) pour voir les pages et cadres du niveau supérieur ; les gros fichiers peuvent être très volumineux.
get_file_infoRécupérer les détails de base d'un fichier via `file_key` (de l'URL du fichier) : nom, propriétaire, type éditeur, vignette et dernière modification, sans charger le design.
get_library_analytics_style_action_data
get_library_analytics_style_usage_data
get_library_analytics_variable_action_data
get_library_analytics_variable_usage_data
get_nodesRécupérer des couches ou cadres spécifiques d'un fichier via `file_key` et nœud séparé par virgule `ids` (de l'ID de nœud dans une URL Figma, ex: '12:34'), avec leurs propriétés et enfants.
get_style
get_webhook
list_actions
list_activity_logs
list_comment_reactions
list_commentsLister les commentaires sur un fichier via `file_key`, avec auteur, texte, emplacement fixé et réponses ; définir `as_md` pour du texte Markdown.
list_dailies
list_dev_resourcesLister les liens développeurs (ex: vers du code, des tickets ou docs) attachés aux couches d'un fichier, optionnellement pour des `node_ids` spécifiques.
list_document_component_sets
list_document_images
list_file_componentsLister les composants publiés dans un fichier bibliothèque via `file_key`.
list_file_stylesLister les styles publiés couleur, texte, effet et grille dans un fichier bibliothèque via `file_key`.
list_folder_meta
list_locals
list_oembeds
list_payments
list_project_filesLister les fichiers de design dans un projet ou dossier via `folder_id`, avec clés de fichier, noms, vignettes et dates de dernière modification.
list_publisheds
list_subfoldersLister les dossiers à l'intérieur d'un projet ou d'un dossier via `folder_id`.
list_team_component_sets
list_team_componentsLister tous les composants publiés dans les bibliothèques de l'équipe via `team_id`.
list_team_projectsLister les projets (dossiers) d'une équipe via `team_id`, le numéro après /team/ dans une URL d'équipe Figma.
list_team_styles
list_usages
list_versionsLister l'historique des versions d'un fichier : versions sauvegardées avec étiquettes, descriptions, auteurs et dates.
list_webhook_requests
list_webhooks
post_commentModifie des donnéesPoster un commentaire sur un fichier avec `file_key` et `message` ; répondre à un commentaire avec `comment_id`, ou le fixer à une position ou nœud avec `client_meta`. Tous ayant accès au fichier peuvent le voir.
react_to_commentModifie des donnéesAjouter une réaction émoji (ex: ':+1:') à un commentaire via `file_key` et `comment_id`.
update_dev_resourcesVisible par d’autres
update_webhookSupprime des données

Configuration en trois étapes

1
Choisissez l’application
Créez un compte PipMCP gratuit et sélectionnez Figma dans la liste des applications.
2
Collez votre clé
Collez un jeton d'accès personnel Figma. Ouvrez Paramètres depuis le menu du compte > Sécurité > Jetons d'accès personnels, cliquez sur Générer un nouveau jeton, choisissez les périmètres nécessaires et copiez le jeton.
3
Ajoutez le lien à votre IA
Vous obtenez un lien MCP personnel. Ajoutez-le à Claude, ChatGPT ou Cursor :
1. Cliquez sur votre nom, puis sur Paramètres › Connecteurs › Ajouter un connecteur personnalisé.
2. Collez votre lien dans le champ URL du serveur MCP distant.
3. Activez-le depuis le menu + d’une conversation.

Questions

Que peut faire l'IA dans Figma ?

L'IA peut lire des fichiers, pages, cadres et couches, commentaires, historique des versions, composants et styles publiés, projets d'équipe et liens développeurs, et exporter des cadres ou des couches en images PNG. Elle peut poster et répondre aux commentaires et ajouter des réactions. Elle peut également supprimer l'un de vos propres commentaires si vous activez cet outil.

L'IA voit-elle mon jeton d'accès Figma ?

Non. Vos identifiants Figma sont chiffrés au repos et jamais montrés à l'IA. Après les avoir sauvegardés, ils ne sont plus affichés, même pas pour vous. L'IA ne voit que les résultats des outils qu'elle appelle.

Puis-je contrôler ce que l'IA est autorisée à faire ?

Oui. Vous choisissez les outils activés pour commencer en lecture seule. Poster un commentaire est visible par tous ayant accès au fichier, et sa suppression est définitive ; les deux peuvent nécessiter votre approbation avant exécution. Chaque appel d'outil est journalisé.

Fonctionne-t-il avec ChatGPT ?

Oui. Dans ChatGPT, allez dans Paramètres › Applications et connecteurs › Avancé et activez le mode Développeur, puis ajoutez votre lien PipMCP. Le mode Développeur nécessite un abonnement payant ChatGPT : Plus, Pro, Business ou Entreprise. Le même lien fonctionne également dans Claude (Paramètres › Connecteurs › Ajouter un connecteur personnalisé), Cursor et d'autres clients MCP.

Quel est le coût ?

PipMCP dispose d'un plan gratuit sans carte de crédit requise. Les plans payants sont facturés par tâche terminée. Vous avez également besoin de votre propre compte Figma.

L'IA peut-elle modifier mes designs ?

Non. L'IA lit les designs et exporte des images, mais ne modifie pas les couches ou les cadres. Les seules choses qu'elle peut écrire sont les commentaires et réactions. Pour lui indiquer un fichier ou cadre, collez le lien Figma. La clé du fichier et l'ID de nœud figurent dans l'URL.