White Space
White space (also called negative space) is the deliberately unmarked portion of a layout — margins, gutters, the gap between lines of type, the empty area around a headline or button — treated as an active part of the design rather than as leftover space around the “real” content. It isn’t tied to any one platform’s design language: Gestalt‘s figure–ground organization, visual hierarchy‘s isolation-as-contrast, and typographic ink density all depend on it to work at all.
White space is the deliberately unmarked portion of a layout — margins, gutters, the gap between lines of type, the empty area around a headline or button — treated as an active part of the design rather than as leftover space around the “real” content.
Balance positive and negative space, don’t just leave gaps
A composition’s positive space — its actual subject or content — carries more visual weight; the negative space around it carries less, and gives the eye somewhere to rest. Isolating an element within generous white space makes it stand out more than the same element surrounded by competing content, since isolation is itself a form of contrast — see Visual Hierarchy for the fuller contrast-variable framework this is one instance of.
Same three actions, same headline — space alone decides which one reads as the page’s main point.
Use figure-ground reversal deliberately, not just as a curiosity
Reversing which region is “ink” and which is “paper” makes the negative space itself into a shape worth noticing — Rubin’s vase (two facing profiles formed by the space around a vase) is the textbook case, but the effect shows up in real logos too: the arrow hidden between the “E” and “x” in the FedEx wordmark, and the digit “1” formed entirely from negative space in Formula One’s 1993–2017 logo. Gestalt psychology‘s own figure–ground organization is the underlying perceptual mechanism this technique exploits.
Give text room to be read, not just written
Extensive white space raises legibility two distinct ways. Around individual lowercase letters, negative space varies letter to letter, which is why lowercase text is read faster than the same words set in all capitals — capitals present a more uniform profile the eye has to work harder to parse into distinct words (see Clear Typography for the fuller typeface/composition treatment). Between paragraphs and sections, added white space reduces perceived density and lowers the cost of starting to read at all — see Plain Language‘s own “add white space” guidance, and Cognitive Load for the underlying mechanism.
Spend white space deliberately, not just where content runs out
Where space is genuinely at a premium — a dense reference table, a small-screen layout — white space is deliberately restricted to fit more in; everywhere else, a page crowded with too little of it reads as cluttered and becomes harder to read regardless of how good any individual element is. Spacing also does double duty as a grouping and hierarchy signal, not just a readability one: elements placed close together read as related and as sharing equal weight, spacing patterns repeated across a layout read as marking equivalent items, and — counterintuitively — giving an element more surrounding space, not less, is what marks it as more important, the same mechanism a page’s own heading hierarchy already relies on. A dashboard’s own grouping technique — separating metric groups with white space instead of a divider line — is one direct application; see Dashboard Design. A grid layout‘s margins and gutters apply the same idea to a page’s outer structure rather than its content groupings. Implementing spacing consistently across a product is usually a job for design tokens — a named spacing scale rather than ad hoc pixel values chosen per instance, most often documented as part of a broader design system.
Related Concepts
Patterns
Principles
Standards
Sources
White space (visual arts) (Wikipedia) is the source for the core definition and the information-density tradeoff.
Negative space (Wikipedia) is the source for the positive/negative visual-weight distinction, figure-ground reversal and its logo examples, and the lowercase-vs-all-caps legibility point.
Carbon Design System: Accessibility, Content, Color, Motion, and Spacing Guidelines (IBM) is the source for white space’s role in creating relationships and hierarchy through spacing, and the “more space signals more importance” rule.