Cross icon
Better in English?
Better in English? Switch the website language for a better experience.
Figma introduit le retour à la ligne responsive avec Text Wrap
Baptiste
0
mn de lecture

Figma introduit le retour à la ligne responsive avec Text Wrap

TL;DR

Figma ajoute deux options de retour à la ligne intelligent, Balance et Pretty, applicables sur un calque, un style ou un paragraphe de texte pour des lignes mieux réparties et plus lisibles.

Deux nouveaux réglages, Balance et Pretty, rendent enfin votre typographie aussi adaptable que le reste de votre design

Ce que change Text Wrap dans le changelog de Figma

Figma vient d'ajouter deux nouvelles options de retour à la ligne pour le texte : Balance et Pretty. Concrètement, vous pouvez désormais définir un comportement de wrap sur un calque de texte, un style de texte, ou même un paragraphe isolé, directement depuis les réglages de texte.

L'idée est simple mais redoutablement efficace : au lieu de laisser le texte se répartir ligne par ligne selon la seule largeur du conteneur, Figma applique un calcul plus intelligent pour équilibrer visuellement le résultat.

Balance : des lignes harmonieuses, sans effort

Balance distribue le texte de façon régulière sur l'ensemble des lignes disponibles. Fini les titres où la première ligne fait toute la largeur du bloc et la seconde ne contient qu'un mot esseulé. Cette option est particulièrement utile pour les titres, les accroches, ou tout texte court où l'équilibre visuel compte autant que le message.

Pretty : la fin du mot orphelin

Pretty s'attaque à un problème que tout designer connaît : ce mot unique qui traîne tout seul sur la dernière ligne d'un paragraphe. Avec cette option activée, Figma ajuste automatiquement la répartition pour éviter cette situation inélégante, sans que vous ayez à retoucher manuellement le texte à chaque itération.

Pourquoi cette fonctionnalité change la donne pour le texte responsive

Jusqu'ici, gérer le retour à la ligne dans Figma relevait souvent du bricolage : on ajustait la largeur du bloc à la main, on retouchait le texte, on croisait les doigts pour que ça tienne au prochain changement de breakpoint. Cette nouveauté automatise un travail qui, sur un site multilingue ou un design system avec de nombreuses variantes de contenu, devenait vite chronophage.

Autre point intéressant : ces réglages ne sont pas propres à Figma. Ils reflètent directement les propriétés CSS text-wrap: balance et text-wrap: pretty, déjà supportées par les navigateurs modernes. Cela veut dire que ce que vous voyez dans Figma correspond, à quelques nuances près, à ce qui peut être obtenu nativement dans le navigateur, sans JavaScript ni hack de mise en page.

Option Figma Comportement Cas d'usage typique
Balance Répartit le texte de façon homogène sur toutes les lignes Titres, accroches, blocs courts
Pretty Évite qu'un mot isolé se retrouve seul sur la dernière ligne Paragraphes, descriptions, corps de texte
Aucun réglage (comportement par défaut) Retour à la ligne classique, sans optimisation visuelle À éviter sur les éléments sensibles à la casse typographique

Notre avis chez Mazette.co : une bonne idée, appliquée avec justesse

Chez Mazette.co, on manipule du texte responsive tous les jours, sur des sites Webflow où chaque breakpoint doit rester impeccable. Et honnêtement, cette fonctionnalité tombe pile où on l'attendait : à l'intersection du design et du développement, là où les petits détails typographiques finissent toujours par coûter du temps.

Ce qu'on apprécie particulièrement, c'est que Figma ne s'est pas contenté d'inventer une nouvelle option isolée. En s'alignant sur les propriétés CSS natives text-wrap: balance et text-wrap: pretty, l'équipe Figma facilite concrètement le passage du design à la production. Pour nous, ça veut dire moins d'allers-retours avec les développeurs pour expliquer « non, ce mot ne doit pas rester tout seul sur sa ligne », et plus de cohérence entre la maquette et le rendu final dans Webflow.

Notre seul bémol : ces réglages restent, pour l'instant, assez discrets dans l'interface. On aimerait les voir intégrés plus directement dans les styles de texte globaux d'un design system, pour que toute une équipe puisse en profiter sans avoir à y penser projet après projet. Mais sur le principe, c'est exactement le genre d'amélioration qui prouve que Figma continue de penser sa plateforme en lien avec le web réel, pas seulement comme un outil de mise en page isolé.

Si vous travaillez sur un projet Webflow avec des exigences fortes en matière de webdesign, cette nouveauté mérite clairement d'être testée dès maintenant sur vos titres et vos blocs de texte les plus visibles.

Code

Copy icon
Check box icon
Mazette.co
/
Blog
/