← Pencilbox
Fluid
CSS clamp() generator
build v6.0
Fluid builds a single CSS clamp() that scales a font size or any spacing value smoothly between two screen widths — no media queries. Set the smallest and largest size, and the viewport range they should scale across; copy the value straight into your stylesheet. Everything runs on your device.

Size

Minimum size18px
Maximum size48px
Unit

Viewport range

Min viewport (px)
Max viewport (px)
Root font size (px)

The quick brown fox jumps over the lazy dog — drag the window to see it scale.

The value is computed with the standard fluid-typography formula: a slope in vw plus a rem offset, capped by your min and max. Between the two viewport widths the size interpolates linearly; below and above it locks to the min and max. The preview scales with this window's width, not the range you set, so it's a feel not an exact match. Everything runs on your device.