Modular Type Scales & Mathematical Ratios

Rather than randomly choosing arbitrary font sizes like 14px, 19px, 23px, and 37px, typography systems use a modular scale—a sequence of font sizes generated by multiplying a base size (usually 16px) by a fixed mathematical ratio.

Common Modular Scales:

• Minor Second (1.067): Subtle steps; ideal for high-density dashboards with many levels of subtext.
• Major Second (1.125): Conservative, balanced steps; common in mobile interfaces.
• Minor Third (1.200): The industry standard for web apps (e.g., 14px, 16px, 19px, 23px, 28px, 34px). Provides distinct contrast between headings without feeling jarring.
• Major Third (1.250) or Perfect Fourth (1.333): High drama; ideal for marketing landing pages and editorial publishing.