PX REM EM Converter

Convert CSS px, rem and em values with configurable base font size.

Open tool

Overview

The PX REM EM Converter switches CSS lengths between pixels, rems and ems with a configurable base font size. Type a value in any unit and see all three at once, so you can copy whichever your stylesheet prefers.

It is built for front-end developers building responsive layouts, designers translating mockups to code and accessibility-minded engineers using relative units to respect user font preferences. Mixing units is fine — knowing which is which avoids subtle layout bugs.

How it works

Browsers compute 1rem as the root element's font size, typically 16 px by default. So 1rem = 16 px and 12 px = 0.75 rem at default settings. em is the same idea but relative to the parent element's font size; the converter assumes the same base for simplicity.

The formulas are rem = px / base, px = rem * base and the same with em since this tool treats em as equivalent to rem at the chosen base. Change the base (e.g., to 10 px for the popular 62.5% trick) and all conversions rescale.

Examples

16 px at base 16  →  1 rem
24 px at base 16  →  1.5 rem
2 rem at base 10  →  20 px
0.875 em at base 16  →  14 px

FAQ

Why use rem over px?

rem respects the user's preferred font size, which matters for accessibility. Users who bump up default text get a proportionally larger layout for free.

What's the 62.5% trick?

Set the root font size to 62.5% (10 px). Then 1 rem = 10 px, making conversions trivial mental arithmetic. The trade-off is breaking the user's true default size.

Is em the same as rem?

Conceptually yes (both are font-relative), but em is relative to the parent's font size while rem is always relative to the root. In nested contexts em compounds; rem does not.

Does pt or pc matter for the web?

Print units (pt, pc) exist in CSS but are rarely used. 1pt = 4/3 px. Most modern stylesheets stick to px and rem.

Why doesn't my value round-trip exactly?

Floating-point rounding can leave a 0.9999 instead of 1. The converter displays sensibly rounded values rather than full double-precision noise.

Try PX REM EM Converter

An unhandled error has occurred. Reload ×