Convert PX to REM
Rem units scale with the root font size, which makes them the go-to choice for accessible, responsive typography. This converter turns pixel values into rem against a configurable root (16px by default), so a value from your design file becomes the rem your stylesheet should use.
12px 16px 20px 24px 32px
0.75rem 1rem 1.25rem 1.5rem 2rem
Try it with your own data
Frequently Asked Questions
What is the difference between REM and EM?
rem (Root EM) is relative to the root element (usually <html>) font size. em is relative to the font size of its nearest parent element.
Why use REM instead of Pixels?
Using rem units is crucial for accessibility. If a user changes their browser's default font size, your entire layout will scale proportionally, which is not possible with static pixel units.
How to convert PX to REM
- Take the pixel value you want to convert.
- Divide it by the root font size (16px in a default browser).
- The result is your value in rem — e.g. 24 ÷ 16 = 1.5rem.
Frequently asked questions
What is the default px to rem ratio?
With the browser default root font size of 16px, 1rem equals 16px. So 16px = 1rem, 8px = 0.5rem, and 32px = 2rem.
Should I use rem instead of px?
Rem respects the user's browser font-size preference, so text and spacing scale for people who increase their default size. That makes rem the more accessible choice for font sizes and most spacing.