Typography

Forty ad-hoc font sizes with no relationship between them. That page doesn't have a type system. It has leftovers.

Tokenize the type first: a size scale, then named styles. heading-lg, body, caption. You reach for a style, not a raw font-size.

Why 65ch, why 1.333, why 1.6 leading — that's readability theory. Grade covers the scale, the leading, and the measure. This lesson is the structure.

Leftover sizes on the left. Named styles on the right. You never pick a heading size by hand.

heading-lg is not 32px. It is three steps up from body. Change the ratio and it moves with everything else.