Figma intègre Claude Code : le code généré par IA devient un design modifiable
Les interfaces web créées avec Claude Code peuvent désormais être converties en calques Figma éditables, grâce à une nouvelle intégration entre les deux outils.
Figma lance « Claude Code to Figma », une fonctionnalité qui permet de convertir les interfaces créées avec l’outil de codage IA d’Anthropic en calques Figma entièrement éditables. Un pont inédit entre code et design.
Claude Code to Figma, une passerelle entre le terminal et le canvas
Figma s’associe donc à Anthropic pour rapprocher encore un peu plus le code du design. Concrètement, les développeurs et développeuses qui utilisent Claude Code, l’outil de codage par IA d’Anthropic, peuvent désormais envoyer une interface web directement dans Figma. L’interface est alors convertie en calques éditables, comme si elle avait été conçue nativement dans l’outil de design. Il ne s’agit pas d’une simple capture d’écran, mais d’un vrai fichier Figma, modifiable par toute l’équipe.
Que vous commenciez par une invite dans Figma Make ou dans Claude Code, l’objectif est le même : obtenir un résultat concret, puis le développer, explique Figma.
Le fonctionnement se veut simple. Il suffit d’installer le serveur MCP (Model Context Protocol) de Figma, puis de taper « Send this to Figma » (Envoyer vers Figma, en français) dans Claude Code. Le rendu de l’interface est alors automatiquement traduit en calques Figma. L’intégration fonctionne aussi dans l’autre sens : une fois le design affiné dans Figma, il est possible de renvoyer les modifications vers le code via le même protocole MCP.
Comparer, annoter, explorer : le design comme espace de décision
Selon le blog post publié par Gui Seiz, directeur du design IA chez Figma, et Alex Kern, ingénieur logiciel, l’intégration vise à répondre à un problème concret : comment sortir du contexte linéaire du code pour explorer des alternatives dans un espace partagé ? Une fois l’interface importée dans Figma, les équipes peuvent collaborer en annotant ce qui fonctionne, en identifiant ce qui manque de clarté, et en testant des approches divergentes, sans demander à quiconque de basculer dans un autre environnement.
La fonctionnalité permet également de capturer plusieurs écrans en une seule session, ce qui doit préserver la séquence et le contexte d’un flux complet (onboarding, checkout, paramètres…). Les frames peuvent ensuite être dupliquées, réorganisées et comparées côte à côte directement sur le canvas.
Les concepteurs, les ingénieurs et les chefs de projet peuvent réagir au même élément, dans le même contexte et avec le même niveau de détail. En l’absence de réponse évidente, une vision partagée permet de faire émerger les questions plus tôt, à un stade où les décisions restent faciles à prendre.
Dylan Field : « Les workflows ne sont plus linéaires »
Dans un billet d’accompagnement, Dylan Field, cofondateur et CEO de Figma, replace cette annonce dans une vision plus large de l’évolution des workflows produit. « Auparavant, les workflows de design et de développement produit étaient souvent linéaires : brainstormer des idées avec son équipe, designer, puis coder. Aujourd’hui, on peut commencer n’importe où et aller partout », écrit-il.
Pour le dirigeant, le canvas de design reste supérieur au prompting dans un IDE pour naviguer parmi de multiples possibilités. « Avec le canvas, on peut penser de manière divergente et voir la vue d’ensemble en comparant les approches côte à côte. On peut aussi utiliser la manipulation directe pour éditer les détails », argumente-t-il, avant de préciser qu’une fois l’exploration terminée, le MCP Figma permet de ramener les modifications dans le code.
Dylan Field alerte aussi sur un risque lié à la facilité de création offerte par l’IA : « C’est tellement facile de se laisser emporter par l’élan de la création… il y a une attraction naturelle à continuer. Et en conséquence, la première version devient souvent la version finale. » L’intégration avec Claude Code vise précisément à contrer cette tendance, en encourageant les équipes à prendre du recul et explorer des alternatives.
Un écosystème Figma-Anthropic qui se renforce
Cette annonce s’inscrit dans une dynamique de rapprochement entre Figma et Anthropic. Fin janvier 2026, les deux entreprises avaient déjà lancé une intégration permettant de transformer des conversations avec Claude en diagrammes FigJam éditables, à partir de prompts textuels, de PDF ou de captures d’écran.
L’ambition affichée par Dylan Field est claire : « Que la création produit commence dans un terminal, une boîte de prompt, une interface visuelle ou un croquis à la main, nous voulons que Figma soit le lieu où tout converge. » Le CEO promet par ailleurs d’autres annonces à venir sur ce terrain.
La fonctionnalité « Claude Code to Figma » est disponible dès maintenant. Elle nécessite l’application desktop Figma, un siège Figma Dev ou Full, et Claude Code installé via npm.
Les meilleurs générateurs de code par IA
Lovable
Jules
Cursor
