design hubs
On this page
Type in Context
2 min read

Display Type

Display type lives at the scale where details become visible and defaults break down. Tracking, leading, and optical adjustments that work at 16px fail at 72px.

Display type — text at headline scales, roughly 36px and above as a working threshold, though the point varies by typeface — behaves differently from text at reading sizes. The letterforms are large enough that their details become prominent: a slightly uneven stroke, a gap that was invisible at 16px, a spacing relationship that looked correct on the type specimen. Display type rewards scrutiny it will inevitably receive, and punishes defaults that worked invisibly at smaller sizes.

What changes at display scale

At reading sizes, the typeface’s default settings handle most situations correctly. At display sizes, three things typically need adjustment.

First, tracking. The optical perception of space between letters changes with scale. At large sizes, letters appear closer together than they physically are — the relationship between positive and negative space shifts. Adding slight positive tracking (0.02em to 0.05em at moderate display sizes, potentially more at very large sizes) restores visual comfort. Leaving tracking at the body-text default at display sizes often makes headlines look too tight.

Second, leading. Display text is rarely more than three or four lines. At these sizes and line counts, tight leading (1.0–1.2) creates a compact, high-impact block. The usual rule — match leading to content length — applies here: a single headline line can use a leading of 1.0; a three-line display block might want 1.1–1.15. The goal is a tight, intentional block, not the comfortable spacing of body text.

Third, optical balance. At very large sizes, certain letterforms require manual adjustment: letters with optical asymmetry may need to be pulled slightly above the baseline to appear visually centred, punctuation may need to hang into the margin, and hyphenation should be tightly controlled.

Typeface performance at scale

Not all typefaces perform well at display sizes. A typeface optimised for reading at 14–16px may have proportions, contrast, and spacing calibrated for that range. At 72px, the same typeface may reveal design decisions that were hidden at small sizes: uneven stroke weights, dated proportions, or a personality that doesn’t translate to the impact of large scale.

Display sizes expose the typeface. Some fonts are specifically designed for display use — with higher contrast, more distinctive letterforms, and spacing calibrated for large use. Others, particularly UI workhorses like system sans-serifs, are designed to disappear at small sizes and may not have the visual character to carry display scale well.

Display type in interfaces

In product interfaces, display type typically appears in hero sections, onboarding screens, empty states, and marketing surfaces. These are high-impact moments where the typography carries a significant share of the design’s communicative work. The care given to display type in these contexts — adjusting tracking, controlling leading, selecting a typeface that performs at scale — is visible and consequential.

See Tracking and Optical Space for the mechanics of tracking adjustment. See Building a Typographic Hierarchy for where display type sits in the broader system.

Practice

0 / 3

Keyboard shortcuts

Show shortcuts
?
Search
CtrlK
Previous article
Next article
Close
Esc