plainlyPX to REM converter
One value or a block of CSS.
Convert sizes with the base you actually use.
Converted size
1.5 rem
At a root font size of 16px.
24px ÷ 16px = 1.5rem
Shown to at most 12 significant digits. Negative values are accepted for uses such as margins.
Convert a block of CSS
Uses the direction and root size above. Comments, quoted strings, and URLs stay intact. Up to 50,000 characters.
This changes numeric dimensions; it does not validate a stylesheet, resolve variables, or compute the CSS cascade. Review the result before using it.
Free to use. Your CSS and values stay in this tab.
A size relative
to the root
A rem is a multiple of the root element’s font size. This PX to REM converter divides a pixel value by that root size. Converting back multiplies the rem value by the same base.
rem = pixels ÷ root font size
pixels = rem × root font size
At a 16px root, 24px is 1.5rem. At a 20px root, the same 24px is 1.2rem. A converter cannot infer your site’s root size: check the computed font size of your html element, especially if your stylesheet or visitor preferences change it.
REM and EM are different
Rem refers to the root font size. Em depends on the element’s font size, or its parent’s font size when used in the font-size property. Nested em-based text can compound. This tool does not assume those units are interchangeable. See MDN’s CSS length reference.
When relative units help
Relative text sizes can respond to a visitor’s chosen default font size. Layout still needs testing when text grows: converting numbers alone does not make a design accessible. Keep deliberate pixel measurements, such as hairline borders, where your design calls for them.
Common sizes.
A clear starting point.
| Pixels | REM |
|---|---|
| 4px | 0.25rem |
| 8px | 0.5rem |
| 12px | 0.75rem |
| 16px | 1rem |
| 20px | 1.25rem |
| 24px | 1.5rem |
| 32px | 2rem |
| 48px | 3rem |
The table uses 16px even if you choose another base in the tool. Your interactive result always uses the root size you entered.
Bulk conversion without rewriting text
Paste CSS, choose the direction above, and select Convert CSS. Numeric dimensions outside comments, strings, and URLs are converted. The optional hairline setting leaves positive and negative 1px dimensions unchanged in PX to REM mode. Quoted content and image paths are preserved.
All dimensions use one supplied root size. CSS variables, differing font contexts, and a root font-size declaration need your review. The tool converts written sizes and does not evaluate expressions or execute the stylesheet. Values are limited to ±1 billion; root sizes range from 0.1 to 1,000px.
A few details
worth getting right
How many pixels is 1rem?
It equals the root font size. With a 16px root, 1rem is 16px; with a 20px root, it is 20px.
Can I convert REM back to PX?
Yes. Change Direction to REM to PX. A valid current size is carried across so the equivalent physical size stays the same.
Does this convert CSS variables?
It converts written numeric dimensions, including dimensions inside functions. It does not resolve var() values or decide which rule wins in the cascade.
Is my stylesheet uploaded?
No. Conversion happens in your browser. Clear the fields or reload to remove your current text.
Keep your code readable.
JSON beautifierCompare text versionsAll tools