Developer utilities
CSS clamp() calculator.
Turn a minimum size, a viewport-based preferred size, and a maximum into a copy-ready responsive CSS value.
Set the bounds
Live result
Set the bounds to preview the clamp.
Responsive type preview
Source and limitations
The calculator applies the CSS clamp(min, preferred, max) model locally. Minimum and maximum inputs are entered in px; output can be rendered as px or rem using the root font-size you supply.
The preview is a visual approximation at the current viewport. It does not know your design system, zoom level, user settings, or the font metrics of your production page.