Type scale

A type scale is a closed list. Once a design has one, 15px is not a smaller choice than 16px, it is an illegal one. That constraint is the whole point: sizes picked one screen at a time drift into a dozen near-identical values that nobody can tell apart and every engineer has to guess between.

Most scales are built by multiplying a base size by a ratio over and over. Common ratios run from the quiet 1.125 (major second) through 1.25 and 1.333 (perfect fourth) to the dramatic 1.5 (perfect fifth) and 1.618 (golden). A small ratio gives many steps that sit close together, good for dense product UI where a caption and a body line must still read as different. A large ratio gives few steps with obvious gaps, good for editorial pages where a headline is supposed to shout. The ratio is a generator, not a law: designers routinely round its output to whole pixels and drop the steps they never use.

Design systems ship the result as named roles rather than as numbers, because the name is what survives a redesign. Material has display, headline, title, body and label; Fluent calls the same idea a type ramp; Apple ties its text styles to Dynamic Type so the reader’s own size preference moves the whole scale at once. A role carries more than a size, since a step is only usable once its weight and its leading are decided with it.

Two things a scale does not settle. It says nothing about measure, the line length that decides whether a size is comfortable, and it says nothing about which role a given piece of content deserves. Both of those are judgement applied on top of the scale, which is why a system with a beautiful ramp can still produce a page where everything is a title.