Figma code layers : prototyper en vrai code sur le canvas
Lecture : 2 min
Figma lance en bêta ouverte les code layers : des calques du canvas qui sont de vrais prototypes codés. On peut les modifier, les comparer et pousser les changements sur une branche Git sans quitter Figma.
Comment ça marche
Pour créer un code layer, tu peux partir d'un dépôt GitHub ou d'un dossier local (une base de code légère, pensée pour le prototypage), d'une maquette existante, d'un site capturé avec l'extension Chrome de Figma, d'un prompt à l'agent Figma, ou de ton outil de code habituel via le serveur MCP.
Ensuite, on commente et on annote les frames, on retouche le code à la main ou par prompt, et on duplique un calque pour comparer deux versions côte à côte. Les changements partent sur une branche, avec une pull request pour la relecture.
Ce que ça change
Designers et développeurs travaillent sur le même objet, au même endroit. Le prototype n'est plus une maquette cliquable qu'on réécrit ensuite : il repart vers Git avec la revue habituelle.
Figma cite Merkle (itérations et développement de fonctionnalités 30 % plus rapides, 50 % de documentation en moins) et un designer de Checkout.com, qui dit avoir monté une démo environ 50 % plus vite. Ce sont des chiffres publiés par l'éditeur, à prendre avec du recul.
Prix et limites
- Bêta ouverte depuis le 15 octobre, sur toutes les offres (hors éducation K-12), avec un déploiement progressif sur quelques semaines. Il faut un accès en édition.
- L'usage consomme des crédits IA, mais la création et l'édition sont gratuites sur les offres payantes jusqu'au 4 novembre 2026. Après cette date, toutes les tâches des code layers consommeront des crédits.
- L'import vise une base de code légère pensée pour le prototypage, pas ton projet de production.
- Pour s'en passer, un administrateur peut désactiver la fonction, mais cela coupe toutes les fonctions IA de Figma.
Autres annonces
Figma sort aussi Specs, un éditeur Markdown pour définir son langage de design, lisible par les équipes comme par les agents (bêta ouverte sur les offres Professional, Organization, Enterprise et éducation). Le CMS Payload, que Figma a racheté l'an dernier, arrive dans Figma Make, et le serveur MCP gagne plus de 20 nouveaux outils compatibles, dont OpenCode et Dia.
Le plus simple pour juger : l'essayer d'ici le 4 novembre sur un petit projet jetable.
Sources
- Figma, « Design together with code layers on the canvas » (15 octobre 2026)
- Blog du Modérateur, « Figma permet désormais de prototyper en code directement sur son canvas collaboratif »
- Figma, What's new from Config India 2026 (offres concernées, crédits, Specs, Payload)
- TechCrunch, « Figma announces new features to define how agents work on its platform » (14 octobre 2026)