TPToolpazar

Global Araç

Css Clamp Generator

CSS
font-size: clamp(1rem, 0.7143rem + 1.429vw, 2rem);
Slope: 0.014286
Y-intercept: 11.4286px (0.7143rem)
Fluid term: 0.7143rem + 1.429vw
Preview at 3 viewport widths

The quick brown fox

viewport: 320px → font-size: 16px

The quick brown fox

viewport: 880px → font-size: 24px

The quick brown fox

viewport: 1440px → font-size: 32px

Generate fluid CSS clamp() values for typography or spacing that scale smoothly between a minimum and maximum viewport width. Skips the hand math — enter min/max sizes and breakpoints, get a working rule that works across modern browsers.

For media queries pair with aspect ratio calculator. For visual polish, box shadow generator and border radius generator.

Nasıl Kullanılır

  1. Enter min size and max size (font-size or spacing).
  2. Enter min and max viewport widths in px.
  3. Pick unit (rem or px).
  4. Copy the clamp() rule.