How is the preferred value calculated?

It solves a linear equation between the min and max viewport/size pairs to get a slope and intercept, expressed in vw units.

Can I output rem instead of px?

Yes, toggle 'Use rem' and set your root font size to convert the min/max sizes and slope to rem.

Can I apply this to other properties like padding?

Yes, change the CSS property field — the same clamp() logic works for any length property.

Does the preview reflect actual browser resizing?

The preview text uses a live clamp() style, so resizing your browser window shows the real fluid scaling.

CSS Clamp() Calculator

Generate fluid typography clamp() CSS from min/max viewport and size.

Works Offline

Privacy First

No Login

No API

CSS property

Min size (px)

Max size (px)

Min viewport (px)

Max viewport (px)

Use rem

Root font size (px)

Live preview

Resize your browser window to see this text scale fluidly between 16px and 32px.

Preview uses your live browser width — resize the window to test the full range.

Generated CSS

font-size: clamp(1.0000rem, 0.6479rem + 1.5023vw, 2.0000rem);

About the CSS Clamp() Calculator

Enter a minimum and maximum font size along with a minimum and maximum viewport width to generate a fluid clamp() CSS value, with a live preview and copy-ready output in px or rem.

Examples

16px to 32px

375px-1440px viewport

Output

font-size: clamp(16px, 0.8889rem + 2.9630vw, 32px);

Related tools

Border Radius Generator

HTML & CSS

Fine-tune per-corner border radii visually.

Box Shadow Generator

HTML & CSS

Layer multiple box-shadows with a live preview.

Clip Path Generator

HTML & CSS

Design polygon clip-path shapes with a live preview.

CSS Animation Generator

HTML & CSS

Build keyframe animations visually with a live preview.

CSS Aspect Ratio Calculator

HTML & CSS

Simplify ratios and compute matching dimensions.

CSS Filter Playground

HTML & CSS

Tune blur, brightness, contrast, and more with a live preview.

Frequently asked questions

Version 1.0.0 · Updated 2026-08-11 · Runs entirely in your browser