Web Tools tools.bryantsmith.com

CSS & Layout

CSS Unit Converter

Type a value, or paste a full value like 1.5rem, and instantly see it in every common CSS unit. Bases for rem, em, percent, and viewports are configurable. Everything runs in your browser — your input never leaves the page.

Runs in your browser v1.0.0

Value to convert

live

Type a number on its own, or paste a full value such as 1.5rem or 50% — the unit updates automatically.

Try

Conversion bases

configurable

Relative units need a reference. Defaults match a typical desktop browser; change them to match your project.

Used by rem
Used by em
Used by %
Used by vw, vmin, vmax
Used by vh, vmin, vmax

Result

live

You have —
Equals —

How it works

Every value is first resolved to pixels, then divided back out into each unit. Absolute units are fixed (1in = 96px, 1pt = 96/72px), while relative units depend on the bases above: rem uses the root font size, em uses the parent font size, % uses the percentage basis, and vw/vh/vmin/vmax use the viewport size. Select any row to copy that value. All conversion happens in your browser and nothing is ever sent anywhere.

Related tools

  • Aspect Ratio CalculatorConvert width and height into a simplified aspect ratio, find a missing dimension from a ratio, and copy a CSS aspect-ratio value.
  • Border Radius GeneratorSet uniform or per-corner border radii with a live preview, then copy the CSS — entirely in your browser.
  • Box Shadow GeneratorVisually build single or layered CSS box shadows and copy production-ready CSS — entirely in your browser.
  • CSS Clamp GeneratorGenerate responsive clamp() values from minimum and maximum sizes and viewport ranges, with a live preview.
  • CSS Filter GeneratorBuild CSS filter chains for blur, brightness, contrast, hue, saturation and more with a live preview and copyable CSS.
  • CSS Gradient GeneratorBuild linear, radial and conic CSS gradients with a live preview and copy-ready CSS — all in your browser.

More CSS & Layout tools