Use this free CSS clamp calculator to create a responsive clamp() formula from minimum size, maximum size, and viewport range.
clamp(1.125rem, calc(0.782609rem + 1.521739vw), 2rem)
18px to 32px from 360px-1280px viewport
Clamp is useful for fluid type and spacing, but still test real text wrapping and tap targets on small screens.
Create fluid heading sizes that grow between mobile and desktop widths.
Generate responsive spacing values without writing several media queries.
Convert a design-system min and max size into copy-ready CSS.
Compare the middle size before placing the formula in a stylesheet.
CSS clamp() formula
Small fluid type rule
Fluid spacing formula
Plain-language answers about when to use the tool, what it does with your inputs, what to double-check, and how privacy works.
Use it when your task matches one of these common needs: Create fluid heading sizes that grow between mobile and desktop widths. Generate responsive spacing values without writing several media queries. It works best when you already know the values, dates, units, or settings the page asks for.
In plain language: The calculator finds a viewport-based slope, calculates the rem intercept, then formats clamp(minimum, calc(intercept + vw), maximum). The examples on the page are there so you can compare your inputs with a filled-out calculation before copying the answer.
The main inputs are the values, text, dates, units, or settings the tool needs before it can work. Read each field label carefully, keep units consistent, and compare your entry with the examples if the answer looks strange.
Read the output next to your original input. If the tool changes format, units, encoding, spacing, or capitalization, compare a small sample before copying the whole result into another app.
Clamp formulas control numeric scaling only. Real layouts still need checks for text wrapping, readability, tap targets, and container width. Also check that you used the right unit, date, scale, or mode because small input changes can change the result.
No. The calculator runs in your browser tab. Your recent answers stay only on the page while you use it, and they are not sent to a server.