Pixels to REM Converter
Convert between CSS pixels, REM, EM, and viewport units. Set your base font size.
About this calculator
Convert between pixels, rem, em and points from a base font size. Type in any field and the others update.
Responsive design works best in relative units, and designers hand over pixel sizes, so a converter saves mental arithmetic.
How to use it
- Set the base font size (16px by default).
- Type a value.
- Read the other units.
The formulas
rem = px ÷ root font-size. With the default root of 16px, 24px is 24 ÷ 16 = 1.5rem. em is relative to the parent element's font size, so it compounds when nested. pt = px × 0.75 (96 px per inch, 72 pt per inch). vw is 1% of the viewport width: on a 1440px screen, 1vw = 14.4px.
Worked example
With a 16px base
| 12px | 0.75rem |
| 16px | 1rem |
| 24px | 1.5rem |
| 32px | 2rem |
| 48px | 3rem |
Tips and common mistakes
- Use rem for font sizes so users' browser settings are respected.
- Use px for borders and hairlines.
- Use em for padding that should scale with the element's text.
- Avoid px-only layouts on mobile.
- Use clamp() for fluid type.
Frequently asked questions
How do I convert px to rem?
Divide the pixels by the root font size, normally 16.
What is rem?
A unit relative to the root (html) font size.
What is the difference between rem and em?
rem uses the root; em uses the parent.
How many pt in a px?
1px = 0.75pt.
What is vw?
1% of the viewport width.
Why use rem?
It respects the user's font-size preference.