em to px

Multiply em by the parent font size. px = em × parent. 1em at a 16px parent is 16px. 2em at an 18px parent is 36px. That 36px is 2.25rem when the root is still 16, because rem does not look at the parent.

Em compounds. A child of a child multiplies again, which is why a nested 1.2em is rarely 1.2 times the root. Put the parent’s computed pixel size in the parent field. Leave the root at 16 unless html itself is set to something else.

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

Root-relative math is on px to rem and rem to px. Absolute units, viewport units, and resolution are on Units.