px to rem

Divide the pixel length by the root font size. rem = px / root. At the browser default of 16px, 16px is 1rem, 24px is 1.5rem, and 18px is 1.125rem.

If the html element is set to 10px, often written as 62.5%, then 16px is 1.6rem. Put 10 in the root field and the rem column follows that root. Em still uses the parent field, so it will not move unless you change the parent too.

Convert

Edit any field. Rem uses the root font size. Em uses the parent font size.

Base sizes

Root font size (px)

Used for rem. Browsers start at 16.

Parent font size (px)

Used for em. Matches rem while this equals the root.

Pixels

Rem

Copies the pixels field.

Common sizes

The same root is used the other way on rem to px. Em is a different base: see em to px. Every group, including absolute and viewport units, is on Units.