FLUID TYPOGRAPHY CALCULATOR

Font size that scales with the screen.

Set a minimum and maximum size across two viewport widths, and get a ready-to-use CSS clamp() value.

Min viewport width (px)

Max viewport width (px)

Min font size (px)

Max font size (px)

The quick brown fox jumps

Resize your browser window to see this scale live

How this works

CSS clamp() takes a minimum, a preferred (fluid) value, and a maximum. The preferred value is calculated as a linear function of viewport width, so the font size grows smoothly between your two breakpoints instead of jumping at fixed sizes.