CSS Unit Converter
Convert between px, rem, em and percent based on your root and parent font sizes.
rem uses the root size; em and % use the parent size.
How to use the CSS Unit Converter
-
Set your base font sizes.
-
Enter a value in any unit.
-
Read the equivalents.
Convert CSS units
Responsive design mixes absolute and relative units. Converting px to rem (for accessibility) or em (for component scaling) means dividing by the right font size. This tool does the math for you across px, rem, em and percent, using base font sizes you set.
Key features
- px ↔ rem ↔ em ↔ %
- Configurable root & parent font size
- Live two-way conversion
- Copy any value
Frequently asked questions
Why convert px to rem?
rem scales with the user's root font size, which respects accessibility settings better than fixed px.
What's the default root size?
Browsers default to 16px for the root font size, which the converter uses unless you change it.
What's the difference between em and rem?
em is relative to the parent element's font size; rem is relative to the root.