Lemma
No. 098

Visual Design

Type Scale

A type scale is a predetermined set of font sizes that are designed to work together. The sizes usually follow a consistent ratio, like each step being 1.25 times the last.

Why it matters

A scale keeps headings, subheadings, and body text feeling related instead of arbitrary. It saves beginners from guessing sizes and gives a layout clear, consistent hierarchy.

In depth

Type scales borrow the idea of musical intervals, where related steps sound harmonious together. Choosing a ratio first and then picking sizes from it prevents the common mistake of having too many slightly different sizes. A larger ratio creates dramatic contrast between levels, while a smaller one feels subtle and editorial.

Real-world example

A design might use 16px for body text, 20px and 25px for smaller headings, and 31px for the page title, all derived from one ratio.

Try it
Caption14.0px
Body17.5px
Subhead21.9px
Title27.3px
Ratio1.25
Back to index