TOOL · DEV
Convert px to rem (and rem to px)
Type a value in either field and the other adjusts instantly — with a configurable base and a table of the most-used conversions ready to copy.
Common conversions
| px | rem | copy |
|---|---|---|
| 4px | 0.25rem | |
| 8px | 0.5rem | |
| 12px | 0.75rem | |
| 14px | 0.875rem | |
| 16px | 1rem | |
| 20px | 1.25rem | |
| 24px | 1.5rem | |
| 32px | 2rem | |
| 48px | 3rem | |
| 64px | 4rem |
The math runs in your browser. A 16px base is the browser default — only change it if your CSS changes the html font-size.
Processed in your browser — your files never leave your computer.
How it works
-
Check the base
16px per 1rem is the browser default — only change it if your CSS changes the html font-size. Accepts comma or dot.
-
Type px or rem
The conversion goes both ways: type pixels and the rem appears; type rem and the pixels appear. Changed the base? Everything recalculates.
-
Copy the result
One click copies the rem value ready for your CSS. Or use the common conversions table (4 to 64 px), which also follows your base and has a copy button per row.
Frequently asked questions
What is rem?
It is the CSS unit relative to the root element (html) font-size. With the default 16px base, 1rem = 16px, 1.5rem = 24px. If the user increases the browser font size, everything in rem grows with it — which is why it is the preferred unit for text.
Why is the default base 16px?
Because it is the font-size every browser applies to html by default. If your project sets another value (html { font-size: 62.5% } → base 10, for instance), just change the "Base" field and the whole math adjusts.
When should I use rem instead of px?
Rem for font sizes, spacing and anything that should scale with user preferences — it is an accessibility matter. Px for things that should not scale, like 1px borders. In doubt, text always in rem.
Is em (without the r) the same thing?
No. Em is relative to the parent element font-size, so the value changes depending on where the element sits — easy to lose track in nested components. Rem is always relative to html, predictable anywhere. This calculator works with rem.
Can I type fractional values, like 13.5?
Yes — comma or dot, either works. The result comes with up to 4 decimal places, without trailing zeros (0.25rem, not 0.2500rem).
Does any data leave my browser?
No. It is one division and one multiplication running locally — no network, no sign-up, nothing stored.