text-wrap: balance vs pretty — Side-by-Side Comparison

TL;DR

• balance: optimize the whole block for equal-width lines. Best for short text (1-6 lines). Use on headings, card titles, tooltips.
• pretty: optimize only the last few lines to avoid orphans. Best for long text (paragraphs). Use on body copy, descriptions.

How balance works

The algorithm uses a binary search over container widths. It computes the natural wrapping at the full max-width, then progressively reduces the effective width until all wrapped lines have similar lengths. The result is a block where every line is roughly the same width — visually symmetric.

Cost: O(n²) in the number of break candidates. To bound this, browsers cap balance at 6 wrapped lines. Past that, the property is silently ignored.

How pretty works

Pretty leaves the first lines alone (using the default greedy algorithm) and only re-evaluates the trailing 4 lines. It looks ahead to avoid orphans (single-word last lines) and widows (short last lines) and chooses better hyphenation candidates.

Cost: constant — the look-ahead window is fixed regardless of paragraph length. Safe to use on arbitrarily long content.

Visual comparison

Same string, 280px container, 18px font:

Default wrap:

The quick brown fox jumps over the lazy dog
several times in
a row

balance:

The quick brown fox jumps over
the lazy dog several times in a row

pretty:

The quick brown fox jumps over the lazy dog
several times in a row

Notice that balance produces nearly equal-length lines, while pretty leaves the first line greedy but optimizes the trailing line to avoid the "in / a row" orphan.

Decision matrix

Scenario	Use
H1, H2, H3 headings	balance
Card titles in a grid	balance
Tooltip / popover bodies	balance (or pretty if > 6 lines)
Article paragraphs	pretty
Product descriptions	pretty
Modal headlines	balance
Modal body copy	pretty
Button labels	nowrap
Form field labels	balance
Form helper text	balance
Code blocks	wrap (default) or nowrap

Performance reality check

For typical UI text (a few hundred words on a page), both balance and pretty are imperceptibly fast. Worry about performance only if you're animating text width or re-rendering thousands of text blocks per frame.