PX to EM Converter

Convert pixels to em relative to a context font size (16px default). Free CSS converter.

Pixels (px)

Context font size (px, default 16)

—

How the nearest RAL match is calculated

Your colour is compared against all 217 RAL Classic colours and the closest one is returned, using a weighted RGB distance (the "redmean" approximation) which weights the channels closer to how the eye perceives them than a plain Euclidean distance would. Everything runs in your browser.

Important: RAL colours are not RGB values

RAL Classic colours are defined by physical paint samples, not by screen values. The hex values used here are the widely used screen approximations from Wikipedia's List of RAL colours, and the same RAL code can look noticeably different when printed on different substrates. Use this converter for on-screen reference only — for paint mixing, printing or production work, always confirm against a physical RAL fan deck.

See the full RAL Classic chart (all 217 colours) →

How it works

em = px ÷ context font size — em is relative to the current element's font size, not the root

Examples

Input	Output
16 px at 16px context	1 em
24 px at 16px context	1.5 em
12 px at 12px context	1 em

Frequently Asked Questions

What is the difference between em and rem?

em is relative to the current element's (or nearest parent's) font size; rem is always relative to the root. Nested em values compound, rem does not.

What context size should I use?

Use the font size of the parent element the text sits in. When in doubt, 16px (the browser default) is a good estimate.

Why do my em values compound?

Because em inherits — a 1.5em element inside another 1.5em element renders at 2.25× the base. Use rem to avoid compounding.