White space, also called negative space, is the intentional empty area between and around elements in a visual layout - the unmarked regions of a page that contain no text, images, or interactive components. Far from being wasted space, it is one of the most deliberate tools a designer has for controlling how a user reads, navigates, and understands an interface.
The term originates in print design, where the physical page made the concept of "empty" area especially visible. In web and digital design, white space is equally present even when a background is colored rather than literally white. What matters is not the color, but the absence of content - the breathing room that separates a headline from a paragraph, a button from its surrounding text, or one section of a page from the next.
Macro and Micro White Space
Designers typically distinguish between two scales of white space. Macro white space refers to the larger gaps that separate major sections of a layout - the padding around a hero image, the margin between a navigation bar and the main content area, or the space between columns in a grid. Micro white space describes the smaller, finer gaps: the leading between lines of text, the letter-spacing within a word, or the padding inside a button. Both scales work together, and neglecting either one tends to make an interface feel cramped or difficult to scan.
White Space and Visual Hierarchy
White space is closely tied to visual hierarchy - the way a layout guides the reader's eye from the most important element to the least. By placing more space around a headline or a call-to-action, a designer signals that it deserves attention. Conversely, tighter spacing between related items implies they belong together, a principle known in Gestalt psychology as the law of proximity. This makes white space an essential companion to typography and grid systems, both of which depend on consistent spatial relationships to communicate structure.
White Space and Readability
Research in reading comprehension consistently shows that generous line height, adequate margins, and sufficient paragraph spacing reduce cognitive load and improve retention. When elements compete for attention without sufficient separation, users must work harder to parse the content. This is why white space is a foundational consideration in any design system, where spacing scales and tokens are defined explicitly to ensure consistency across an entire product.
A common misconception is that white space represents a failure to use available screen real estate. In practice, the opposite is true: removing white space to fit more content typically reduces the effectiveness of all the content present. Purposeful restraint in layout is what allows individual elements to communicate clearly.