Category: Developer tools

CSS Unit Converter

System ideaMissing a tool?

Convert px, rem, em, %, vw and vh

Enter a value in px, rem, em, percent, vw or vh, plus the base font size, viewport and container it is relative to, and get the same length in every other unit.

px16rem1em1%5vw1.25vh2.222

Conversion happens in the page from the numbers you type. Nothing is sent anywhere.

Everything on this page is processed in your browser. Nothing is uploaded.

What this tool does

A pixel value converts to rem the same way everywhere, but percent, vw and vh do not: they depend on a container size or a viewport that changes from page to page. This tool asks for that context up front, so the numbers it gives back are the ones that would actually render, not a generic 16px-root guess. rem and em are treated the same way here, both scaled from the base font size you give, since without a real parent element on the page there is no separate parent size to tell them apart by. Change the base font size to see how a visitor's enlarged text setting shifts every rem and em value at once.

How to use it

  1. Enter the value and pick the unit you are converting from.
  2. Set the base font size, viewport width and height, and container size it applies to.
  3. Read the same length converted into every other unit.

Privacy

This tool runs entirely in your browser. Your input is never uploaded, stored or shared — closing the tab removes it.

Frequently asked questions

Why do rem and em give the same result?
Both scale from a base font size. rem always uses the root size and em the parent's, but this tool has no page to read a real parent size from, so it treats the base font size you enter as both.
What is the container size used for?
It is the reference for percent: a percentage is only meaningful relative to something, and here that something is the container size you enter.
Is anything sent to a server?
No. The conversion is calculated in the page from the numbers you type.