Skip to content

Tools/CSS units

CSS units

Convert px and rem, build clamp(), and a modular type scale. Nothing is uploaded.

Loading tool…

How to use CSS units

  1. 1. Set root px. Usually 16.
  2. 2. Convert px ↔ rem. Simple division.
  3. 3. Fill clamp min / vw / max. Emits clamp(min rem, vw, max rem).
  4. 4. Type scale. Base × ratio ** step.

About this tool

Fluid type is clamp() plus a modular scale. This calculator converts px and rem, writes a clamp() with rem bounds, and prints eight steps around a base size.

Preferred vw

The middle argument is Nvw as you typed it, not a computed px at a breakpoint.

User font size

rem follows the root. If the user zooms, both sides scale.

Code examples

clamp

clamp(0.875rem, 2vw, 1.375rem)

Frequently asked questions

Related tools

All tools