Design 007

Alignment

How elements line up against a shared edge. Alignment is the cheapest order there is, and the first thing missing when a layout feels off.

Alignment is order at zero cost: elements agreeing on a shared edge, and the invisible lines those agreements draw across a page. The eye connects whatever lines up, which means alignment is also information, declaring what belongs together before a single word is read.

Almost every layout that feels vaguely wrong is misaligned somewhere, a caption two pixels adrift, a block splitting the difference between two edges. The discipline is binary: an element either sits on the shared edge or is visibly, deliberately off it. The space between reads as error.

See also GridBaseline
The full Lexicon ↗

Want to speak the same language?

Start a conversation ↗