Prefer English?
Prefer English? Switch the website language for a better experience.
Figma has just added two new line-wrapping options for text: Balance and Pretty. In practical terms, you can now define wrapping behavior on a text layer, a text style, or even a single paragraph, directly from the text settings.
The idea is simple but remarkably effective: instead of letting text wrap line by line based solely on container width, Figma now applies a smarter calculation to visually balance the result.
Balance distributes text evenly across all available lines. No more headlines where the first line spans the full width of the block and the second is left with a single lonely word. This option is especially useful for headlines, taglines, or any short text where visual balance matters as much as the message itself.
Pretty tackles a problem every designer knows well: that one stray word hanging alone on the last line of a paragraph. With this option enabled, Figma automatically adjusts the distribution to avoid this awkward situation, without you having to manually tweak the text with every iteration.
Until now, managing line breaks in Figma often meant manual tinkering: adjusting block width by hand, tweaking the text, and hoping it would still hold up at the next breakpoint. This new feature automates work that could quickly become time-consuming on a multilingual site or a design system with many content variations.
Another interesting point: these settings are not exclusive to Figma. They directly reflect the CSS properties text-wrap: balance and text-wrap: pretty, already supported by modern browsers. This means that what you see in Figma corresponds, with only minor nuances, to what can be achieved natively in the browser, with no JavaScript or layout hacks required.
| Figma Option | Behavior | Typical Use Case |
|---|---|---|
| Balance | Distributes text evenly across all lines | Headlines, taglines, short blocks |
| Pretty | Prevents a single word from being left alone on the last line | Paragraphs, descriptions, body text |
| No setting (default behavior) | Standard line wrapping, with no visual optimization | Best avoided on elements sensitive to typographic detail |
At Mazette.co, we work with responsive text every day, on Webflow sites where every breakpoint has to stay flawless. And honestly, this feature lands exactly where we'd hoped it would: at the intersection of design and development, where small typographic details always end up costing time.
What we particularly appreciate is that Figma didn't just invent a new standalone option. By aligning with the native CSS properties text-wrap: balance and text-wrap: pretty, the Figma team makes the transition from design to production genuinely easier. For us, that means fewer back-and-forths with developers to explain "no, that word can't be left alone on its own line," and more consistency between the mockup and the final result in Webflow.
Our only reservation: for now, these settings remain fairly hidden within the interface. We'd like to see them integrated more directly into a design system's global text styles, so an entire team could benefit from them without having to think about it project after project. But in principle, this is exactly the kind of improvement that proves Figma continues to build its platform in step with the real web, not just as a standalone layout tool.
If you're working on a Webflow project with high standards for web design, this new feature is definitely worth testing right away on your headlines and most visible text blocks.
Code
Over 120 companies have already stepped out of the shadows with us.
Text Wrap is a new text formatting option in Figma that offers two settings, Balance and Pretty, to control how text wraps across multiple lines. It can be applied to a text layer, a text style, or an individual paragraph, making typography more responsive to changes in container width.
Balance distributes text evenly across all lines, avoiding very short or very long lines sitting side by side. Pretty, on the other hand, focuses on the last line of a paragraph and prevents a single word from being left stranded on it, a common typographic issue known as an orphan.
No, the result carries over directly. The CSS properties text-wrap: balance and text-wrap: pretty are natively supported in modern browsers, and Webflow lets you apply them through custom classes, making the move from design to production nearly seamless.
