What is a type scale?

An old idea with new arithmetic

Printers worked from a fixed set of sizes long before software, because metal type had to be cast in each size and shops owned only so many. Sizes such as 6, 8, 10, 12, 14, 18, 24, 36, 48 and 72 points became the traditional scale, and Spencer Mortensen's essay on the typographic scale shows how closely those numbers follow a regular mathematical progression. Digital tools removed the physical limit, and people started typing any size they liked. A type scale restores the discipline on purpose. Google Fonts defines a scale as a predefined set of intervals that dictate font sizes within a typographic system, and a type ramp is the same idea with a named role for each step.

How a modular scale works

Pick a base size, usually the body text, and a ratio. Multiply the base by the ratio to get the next size up and divide to get the next size down. With a 16 pixel base and a ratio of 1.25 the steps run 12.8, 16, 20, 25, 31.25 and so on, as the table shows. Smaller ratios such as 1.125 give gentle steps suited to dense interfaces and documents. Larger ratios such as 1.5 give dramatic jumps suited to posters and flyers, where the headline and the details should never be confused. Rounding the results to whole numbers is normal and changes nothing a reader can see.

Why fewer sizes read better

Size is the strongest signal of importance on a page. When a flyer uses eight slightly different sizes, readers cannot tell which differences are deliberate, and the order of reading becomes a guess. With three or four sizes from a scale, each level is obviously different from its neighbours, so the eye moves from headline to key facts to details without effort. Butterick makes a related point about headings: they need to be distinct from body text, but not enormous, and space and weight can do much of the work. A scale also saves time, since every new block already has a size waiting for it.

Common mistakes

The first is using too many steps. A scale with ten sizes on a single flyer is not a system, it is a menu, and the page will look busy. The second is a ratio so small that neighbouring steps look the same, which defeats the purpose. The third is breaking the scale for one awkward headline, nudging it down a point to fit, when the better fix is to shorten the words. A fourth is scaling up body text for a poster while keeping the flyer ratio, so the headline no longer dominates at a distance.

One scale across print and social sizes

A scale describes relationships, not fixed numbers, which makes it useful when one campaign appears at several sizes. An A4 flyer, a square post and a wide banner can share the same steps and ratio, with the base size adjusted for each canvas. Readers who see the flyer and then the post recognise the same pattern of a dominant headline, a clear middle level and small details, even though every number changed. The part that does not transfer automatically is the smallest step. Text that is comfortable on paper at arm's length can be far too small on a phone, so the bottom of the scale usually moves up a step on social canvases while the headline stays at the top.

The type ramp in the flyer builder

The flyer builder does not ask for point sizes. Each text block's Size control picks a step from the theme's type ramp, and the ramp's 19 size classes come from the shared layout geometry that slides use too. Because the classes are fixed, changing the theme or font restyles every block together and the order between them survives. The practical move on a flyer is to use three or four of those classes, one for the headline, one for key facts such as the date and price, one for details and perhaps one for fine print, and resist giving each block its own step.

Questions people ask