PX to REM Converter — Custom Root Font Size
Convert px to rem with your root font size. Try the live calculator, compare 16px and 20px roots, and copy CSS values. Free browser tool with worked examples.
This conversion runs only in your browser — nothing is uploaded.
- Root / base font size16px
- Unitpx
em in real CSS follows the parent element's font-size; this tool approximates rem and em with the same root/base value.
- rem
- px
- em
- pt
When to use this
- Turn pixel-based design specs into root-relative spacing tokens.
- Migrate typography sizes while keeping the current root size explicit.
- Check a component at a larger root size chosen by the reader.
How the result is calculated
rem = px / rootPx. For 24px, a 16px root gives 1.5rem; a 20px root gives 1.2rem. The same 1.5rem token becomes 30px when the root changes to 20px. These are different questions: converting a fixed target size versus scaling an existing token.
Worked examples
Reference values below use the stated root size. The interactive tool above uses your current settings.
| Input | Result | What to check |
|---|---|---|
| 0px | 0.0000rem | 16px root |
| 1px | 0.0625rem | 16px root |
| 8px | 0.5000rem | 16px root |
| 12px | 0.7500rem | 16px root |
| 16px | 1.0000rem | 16px root |
| 18px | 1.1250rem | 16px root |
| 24px | 1.5000rem | 16px root |
| 32px | 2.0000rem | 16px root |
| 48px | 3.0000rem | 16px root |
Practical pitfalls
- 16px is a starting assumption, not a fixed browser rule. Read the computed font-size of html when a project or user setting changes it.
- rem follows the root. em used for font-size follows the inherited font size; for other properties it follows the element's font size. This calculator uses one base for both.
- Relative units alone do not prove accessibility. Test text enlargement, zoom, line wrapping and controls in the actual layout.
References
Last reviewed: 2026-10-11
Task guides with ready-to-use settings
- REM to PX Converter — Check Computed Sizes
Multiply rem by the root font size: 1.5rem is 24px at a 16px root and 30px at a 20px root. Use your page's computed html font size. The calculator runs locally.
- REM to PT Converter — CSS & Print Reference
For CSS reference units, pt = rem * rootPx * 72 / 96. At a 16px root, 1rem is 12pt and 1.5rem is 18pt. Conversion stays in your browser; verify the printed output separately.
Frequently asked questions
- How many rem is 24px?
- 24px is 1.5rem at a 16px root, 1.2rem at a 20px root, and 2.4rem at a 10px root. Divide 24 by your actual root size.
- Does 1rem always mean 16px?
- No. 1rem equals the computed root font size. Browser defaults, user settings and your CSS can change that size.
- Can I paste an entire stylesheet?
- This tool converts one numeric value at a time and copies unit results. It does not rewrite CSS rules or automatically inspect your site's root size.