CSS Clamp Calculator

Fluid sizes for Divi 5, in seconds.

How it works

Simple CSS Clamp Calculator

Size settings
Viewport settings

Generated CSS

clamp(16px, 1.55vw + 11.03px, 32px)

Copy copies the whole clamp(
). Paste it into any size field in Divi 5 (it recognizes clamp and sets the unit for you), or save it as a global variable.

Text preview

This text scales responsively with your clamp settings. Resize the browser window to see the effect!

Sizing preview

This square's size is your clamp value, the way it works for sizing, margin, or padding:

Base font settings
Viewport settings
Typography scale

Generated typography scale

Base spacing settings
Viewport settings

Generated spacing scale

Want to take this further?

Using clamp is just one piece of a solid Divi 5 Design System.

See what's inside