Free PX to REM Converter
Convert pixels to rem and back with a custom root font size, plus a reference table of common sizes.
| Pixels | Rem |
|---|---|
| 4px | 0.25rem |
| 8px | 0.5rem |
| 10px | 0.625rem |
| 12px | 0.75rem |
| 14px | 0.875rem |
| 16px | 1rem |
| 18px | 1.125rem |
| 20px | 1.25rem |
| 24px | 1.5rem |
| 28px | 1.75rem |
| 32px | 2rem |
| 40px | 2.5rem |
| 48px | 3rem |
| 56px | 3.5rem |
| 64px | 4rem |
rem = px ÷ root font size. Browsers default to 16px; the table follows your root size above.
How to use / FAQ
What is a rem, exactly?
One rem equals the font size of the root (html) element — 16px in every browser's default settings. So 1rem = 16px, 1.5rem = 24px, and 0.875rem = 14px, unless a stylesheet changes the root size.
Why use rem instead of px?
Rem values scale with the user's browser font-size setting, so people who bump their default text size get a proportionally larger interface — a genuine accessibility win. Pixel values ignore that preference. Rem also keeps spacing and type in one consistent scale you can retune by changing a single root value.
What's the difference between rem and em?
Rem is always relative to the root element; em is relative to the current element's own font size, so nested em values compound (1.2em inside 1.2em is 1.44× the outer size). That compounding is why most design systems prefer rem for anything structural.
Should I set the root font size to 62.5%?
That old trick makes 1rem equal 10px so the math feels rounder. It works — set the root size field to 10 to convert for such a project — but it overrides the user's chosen default size, so many teams now leave the root at 100% and just get comfortable dividing by 16.
Is anything sent to a server?
No — the conversion is a single division that runs in your browser as you type.