Pixel to REM Converter
Converts CSS units between px and rem
Base font size
px
Most browsers default to 16px. 1rem=1 × base font size.
Conversion
px
rem
Reference table
Base: 16px
| Pixel | REM | Pixel | REM |
|---|
What is REM?
REM (Root EM) is a relative CSS unit based on the font size of the <html> element.
Unlike EM, which is relative to the parent element, REM is consistent throughout the document.
Advantages of REM
- Better accessibility
- Easier to scale
- Consistent proportions
- Respects browser settings
CSS example
html { font-size: 16px; }
h1 { font-size: 2rem; /* 32px */ }
p { font-size: 1rem; /* 16px */ }Tips
- Use rem for font sizes
- px for borders and shadows
- rem for spacing (margin, padding)
- 62.5% trick:
html { font-size: 62.5%; }makes 1rem=10px
Was this tool helpful?