PX to REM Converter
Convert px to rem and em (and back) with a configurable root font-size, a live table of common values, and copy-ready CSS.
Root font-size 16px is used for the maths. The em value assumes the element's parent also uses this size.
— — Type a value above to see the conversion.
Common px ⇄ rem table
at 16px root| px | rem | em | CSS |
|---|
About the PX to REM converter
Modern, accessible CSS leans on relative units. Sizing type, spacing, and layout in
rem means everything scales together when a visitor bumps up their browser's
default font-size — something fixed pixels ignore. This converter does the arithmetic both
ways: type pixels to get rem and em, or type a relative value to
read the pixels back. Change the root font-size and every result, plus the reference table,
updates instantly.
- The formula is simply
rem = px ÷ rootandpx = rem × root. - Keep the root at 16px unless your stylesheet deliberately changes
html { font-size }. - Setting the root to 10px makes conversions easy to read: 24px becomes 2.4rem.
- Use the table for the values you reach for most — 8, 12, 16, 24, and 32 px.
How it works
Three steps. No sign-up, no upload, no wait.
Set your root font-size
Most browsers default to 16px. Change it here if your site uses a different base.
Type a value
Enter pixels to get rem and em, or enter rem/em to get pixels back — both directions update live.
Copy the CSS
Grab the ready-to-paste value, or copy any row from the conversion table below.
Private by design.Everything happens right here in your browser. Your files are never uploaded — we never see them.
Frequently Asked Questions
What is the difference between px, rem, and em? ▼
px is a fixed pixel. A rem is relative to the root font-size (the <html> element), so 1rem = 16px by default. An em is relative to the font-size of the current element's parent — in this tool we treat em against the same root value for a simple, predictable conversion.How do I convert px to rem? ▼
rem = px ÷ root. With the standard 16px root, 24px ÷ 16 = 1.5rem. This tool does the maths instantly and gives you a copy-ready value.How do I convert rem back to px? ▼
px = rem × root. So 1.5rem × 16 = 24px. Switch the direction toggle to rem/em → px to type a rem value and read the pixels.Why should I use rem instead of px? ▼
rem lets your whole layout scale when a user changes their browser's default font-size for readability or accessibility. Fonts, spacing, and containers sized in rem grow together, while fixed px values ignore the user's preference.What if my site doesn't use a 16px root? ▼
html { font-size: 62.5%; } to make the root 10px, so 1rem = 10px and the maths becomes easy (24px = 2.4rem). The table and conversions update to match.