Px to rem converter
Turn pixel values into rem units, or go the other way. Set your root font size and both fields stay in sync. Everything runs in your browser, so your values stay on your device.
px
rem
16px equals 1rem at a root size of 16px.
The font size set on your html element.
Common sizesBrowsers default to 16px. If your CSS sets
html { font-size: 62.5% }, use 10.Tip: press Enter in either field to copy the rem value.
Common sizes
Based on a root font size of 16px.
| Use | Pixels | Rem | Actions |
|---|---|---|---|
| Caption | 12px | 0.75rem | |
| Small text | 14px | 0.875rem | |
| Body text | 16px | 1rem | |
| Large body | 18px | 1.125rem | |
| Subheading | 24px | 1.5rem | |
| Heading | 32px | 2rem | |
| Large heading | 48px | 3rem | |
| Display | 64px | 4rem |
How it works
1
Set the root size
Use 16px unless your project sets a different font size on the html element.
2
Type a value
Enter pixels or rem. The other field updates as you type.
3
Copy the result
Copy the rem value with its unit, ready to paste into your CSS.