Better in English?
Better in English? Switch the website language for a better experience.
Le 24 juillet 2026, Figma a discrètement publié l'une des évolutions les plus structurantes de son moteur de mise en page depuis l'introduction de l'Auto Layout. L'annonce tient en une phrase dans le changelog officiel, mais son impact est loin d'être anecdotique : Figma fait évoluer son option Auto Layout pour qu'elle se comporte comme le CSS.
Jusqu'ici, un décalage subtil mais bien réel existait entre la façon dont l'Auto Layout gérait certains comportements (redimensionnement, wrap, contraintes de taille) et la façon dont les mêmes règles s'appliquent en CSS moderne, notamment avec Flexbox et Grid. Résultat concret sur le terrain : les développeurs devaient régulièrement ajouter des ajustements manuels au moment du handoff pour que la version codée corresponde fidèlement au design validé sur le canvas.
Cette mise à jour ferme ces écarts. L'Auto Layout se rapproche désormais du comportement réel du CSS, ce qui signifie que ce que vous voyez sur Figma ressemble davantage, structurellement, à ce qui sera produit en code.
Figma a pensé la bascule pour ne pas casser les projets en cours :
Cette approche progressive laisse le temps aux équipes de tester la migration sur des projets pilotes avant de généraliser, plutôt que de subir un changement de comportement du jour au lendemain sur l'ensemble d'une bibliothèque de composants.
| Aspect | Ancien Auto Layout | Nouvel Auto Layout (aligné CSS) |
|---|---|---|
| Comportement de redimensionnement | Règles propriétaires à Figma | Calqué sur Flexbox / Grid |
| Fidélité design vers code | Écarts fréquents à corriger | Correspondance directe |
| Migration des fichiers existants | — | Optionnelle, réversible jusqu'à janvier 2027 |
| Nouvelles frames | — | Nouveau comportement par défaut |
Chez Mazette.co, Figma est notre outil de travail quotidien pour concevoir les interfaces avant de les développer sur Webflow. Et sur ce type de mise à jour, on a un avantage direct : moins d'écart entre le fichier de design et le site livré, c'est moins de temps passé à réexpliquer une intention de mise en page qui semblait pourtant limpide sur le canvas.
Concrètement, l'Auto Layout historique fonctionnait bien tant qu'on restait dans des cas simples. Dès que la mise en page devenait un peu plus fine (wrap conditionnel, comportements de redimensionnement imbriqués, contraintes multiples), on tombait régulièrement sur des situations où le rendu Figma ne collait plus exactement à ce que produit un vrai Flexbox ou Grid en CSS. Le développeur devait alors trancher : suivre à la lettre le fichier Figma, quitte à obtenir un résultat un peu bancal, ou s'écarter légèrement du design pour respecter une logique CSS plus saine. Ni l'un ni l'autre n'était vraiment satisfaisant.
Cette mise à jour s'attaque directement à ce problème de fond, plutôt qu'à une fonctionnalité cosmétique. C'est le genre d'évolution qui ne fait pas de bruit dans les timelines mais qui change réellement le quotidien d'une équipe produit-design-dev.
Notre seul bémol : la fenêtre de coexistence entre ancienne et nouvelle version, si elle est nécessaire, peut aussi créer une confusion temporaire dans les équipes si certains fichiers restent sur l'ancien comportement et d'autres passent au nouveau sans documentation claire côté design system. On recommande donc de traiter cette migration comme un vrai chantier, avec un audit préalable des composants critiques, plutôt que de laisser chaque designer basculer au fil de l'eau.
Si vous travaillez avec une équipe product design qui construit ses interfaces sur Figma avant intégration Webflow, c'est le moment de revoir vos bibliothèques de composants pour profiter de cette meilleure correspondance entre design et code. Et si votre agence explore justement comment mieux connecter Figma et Webflow au quotidien, notre page agence Figma détaille notre approche.
Code
Plus de 120 entreprises sont déjà sorties de l'obscurité à nos côtés.
Cette mise à jour aligne le comportement de l'Auto Layout sur les règles de mise en page du CSS moderne, notamment sur la gestion du redimensionnement, de l'espacement et des contraintes. Concrètement, ce qui est conçu sur le canvas Figma se comporte de la même façon une fois transposé en code, sans les petits écarts qui obligeaient les développeurs à ajuster manuellement le résultat.
Non, ce n'est pas obligatoire dans l'immédiat. Les frames existants restent sur l'ancienne version tant que vous ne choisissez pas de les mettre à jour, alors que les nouvelles frames héritent automatiquement du nouveau comportement. Il est possible de repasser à l'ancienne version jusqu'en janvier 2027, ce qui laisse le temps de tester la migration sereinement sur les projets en cours.
Oui, c'est précisément l'objectif de cette mise à jour. En rapprochant le comportement de l'Auto Layout des règles du CSS Flexbox et Grid, Figma réduit les cas où un développeur devait recréer une mise en page différemment de ce qui était visible sur le design. Pour des workflows de développement Webflow, où la fidélité au design compte beaucoup, cela limite les corrections de dernière minute lors du handoff.
