Typography Scale Generator

Generate a modular type scale from a base size and ratio. Preview each step and copy the CSS custom properties.

Base size (px)

Scale ratio

Steps above base

Output unit

CSS custom properties

About Typography Scale Generator

A modular scale multiplies a base size by a ratio at each step. Perfect Fourth (1.333) and Major Third (1.250) are most popular for body text. Golden Ratio (1.618) creates dramatic display scales. The CSS custom properties use semantic names (--text-xs → --text-6xl) matching Tailwind conventions for easy drop-in use.