Back to Resources
Typography Scale Calculator
Generate perfect font size scales for your web projects
Generated Scale
xs
9px
The quick brown fox
sm
12px
The quick brown fox
base
16px
The quick brown fox
lg
21.33px
The quick brown fox
xl
28.43px
The quick brown fox
2xl
37.9px
The quick brown fox
3xl
50.52px
The quick brown fox
4xl
67.34px
The quick brown fox
5xl
89.76px
The quick brown fox
About Typography Scales
A typography scale creates visual harmony by using mathematically related font sizes. Each size is calculated by multiplying the base size by the ratio raised to a power.
The Perfect Fourth (1.333) is commonly used for web design, while the Golden Ratio (1.618) creates more dramatic contrast between sizes.