Skip to content We're live on Product Hunt today Upvote
install

tool · one of 34 free, no counter

Units

What is 24px in rem here - and what clamp() gives me that curve?

Every online px-to-rem converter assumes a root font size of 16, and that is wrong on any site that has changed it and on every browser where the reader has. This reads the bases from the page - root size, the element’s own size, and a measured ch - and every one of them stays editable, so the arithmetic is against the document you are looking at.

Reach it Press + K on any tab and type units. Ctrl + K on Windows and Linux

Turns two sizes at two widths into one clamp()
reads the page’s length bases
writes nothing
sends nothing
bases read from the page, and all editable
clamp the line through two points, never a vw guess
rounding once, at the end - precision is full
plan free
section#about

What this actually is

Whenever a value from a design has to become a unit, and whenever a fluid type step has to be written. The sweep is a fixed 320–1920 whatever bounds you pick, because what a clamp does outside your two points is the interesting part.

section#asked

Asked about this tool

Why is rem the default rather than px?

Because a px floor ignores a raised default font size, which is the accessibility setting most often set and least often tested against.

How is the middle term of the clamp worked out?

It is the line through your two points - two widths and two sizes - rather than a vw value chosen to look about right. A guessed vw is correct at one width by accident.

What if I put the bounds the wrong way round?

It is named and the declaration is still generated. Refusing would hide the fact that an inverted clamp is a legal thing browsers do something specific with.

Why is there no percentage row?

Because a percentage is relative to a containing block this converter cannot see, so every number it produced would be a guess wearing a unit.

how to use units

  1. Open Units on the page the value has to work on.
  2. The bases are read from the page - root size, the element's own size, a measured ch - and stay editable.
  3. Convert the value, or write a clamp() through two points instead of guessing a vw.
  4. The sweep runs 320-1920 whatever bounds you picked, so two curves stay comparable.