Major-third 1.250 stays my default for product UI because it scales without drama
Perfect-fourth 1.333 carries marketing pages where the headline must do real work
Augmented-fourth 1.414 fits dashboards where six type levels need clear hierarchy
Golden ratio 1.618 reads beautiful in editorial but breaks below 14px body
Type scale is the quietest decision in a design system and the loudest one at scale. Pick wrong and every component fights you for the next two years. I have shipped four products this year on four different scales, and the pattern is clearer than I expected.
Type Scale 1: Major Third (1.250) for Product UI
The major third is my default for anything a user touches daily. Body sits at 16px. Caption drops to 12.8px (rounded to 13). H3 lifts to 20px, h2 to 25px, h1 to 31px.…