Skip to main content
Web Development

CSS Clamp Calculator

Generate fluid clamp() values for font sizes, spacing, and layout. Enter your min/max values and the viewport breakpoints to get a ready-to-use CSS value.

px
px

Min clamp

Preferred

Max clamp

How CSS clamp() works

clamp(min, preferred, max) constrains a value between a minimum and maximum. The preferred value scales with the viewport using vw units. The formula calculates the slope and intercept so the value transitions smoothly from min at minVw to max at maxVw.

Slope formula: slope = (maxSize − minSize) / (maxVw − minVw)

🔒 Privacy

All calculations happen in your browser. No data is sent anywhere.

Related tools