โ All Tools
PX To REM Converter๐ 100% local
Pixels to REM units. Privacy-first, no server uploads, no tracking.
Converts pixel values into rem, em and pt and prints a padded table plus a ready-to-paste CSS line. A single value, a comma or space separated list, or an explicit root font size such as '24 root 18' all work; the root defaults to 16px and the first value in your list drives the generated CSS declaration.
How to use it
- Type a value like 16, or a list like '12, 24, 32'.
- Add a root override when your base font size is not 16, using either 'root 18' or a second trailing number.
- Press Process. The table covers every value and the last line is the CSS for the first one.
Worked example
16becomesRoot font-size: 16px โ 1rem = 16px
px rem em (root ctx) pt
16 1.0000 1.0000 12
Formula: rem = px รท root font-size
CSS: font-size: 1.0000rem; /* was 16px */12, 24, 32becomesRoot font-size: 16px โ 1rem = 16px
px rem em (root ctx) pt
12 0.7500 0.7500 9
24 1.5000 1.5000 18
32 2.0000 2.0000 24
Formula: rem = px รท root font-size
CSS: font-size: 0.7500rem; /* was 12px */All three values are tabulated, but only the first (12px) appears in the generated CSS line.
16, 24becomesRoot font-size: 24px โ 1rem = 24px
px rem em (root ctx) pt
16 0.6667 0.6667 12
Formula: rem = px รท root font-size
CSS: font-size: 0.6667rem; /* was 16px */Two plain numbers are read as 'value, root', not as a two-item list: 16px is converted against a 24px root.
When to use it
- Converting a design's pixel values into rem so type and spacing follow the reader's browser font size setting.
- Building a spacing scale in CSS from a pixel spec sheet someone handed you.
- Checking what a 14px label becomes when the root font size is 18px instead of 16px.
What it does not do
- Exactly two numeric tokens are treated as 'value, root', so '16, 24' converts 16px against a 24px root and returns 0.6667rem. Use a third value or the 'root N' form when you really meant a two-item list.
- The em column divides by the same root size as rem, which is only correct where the element's own font size equals the root - em is relative to the parent, and this tool has no idea what your parent is.
- pt ignores the root entirely: it is a flat 0.75 multiply, the usual 96dpi pixels-to-points convention.
- Values are formatted with toFixed(4), so repeating decimals are cut off for display and the copyable CSS line carries the same four-place rounding.
- One unparseable token aborts the whole run with 'Could not parse' - the good values in the list are not converted either.