16px to rem = 1rem
16 pixels equals 1rem at the default root font size of 16px. Adjust the root size below to recalculate.
What’s 16px used for?
16px is the browser default root font size and the most common 'base' for design systems. Setting html to 16px (or just leaving the default) gives you the rem-to-px relationship that nearly every CSS framework assumes: 1rem = 16px. It's also the WCAG-recommended floor for body text and the safest default for accessibility.
How it works
To convert 16px to rem, divide by the root font size: 16 / 16 = 1. The rem unit is relative to the root element’s font size, which browsers default to 16px.
16px to rem at different root sizes
If you’ve overridden the html root font size, the rem equivalent of 16px shifts. Here’s 16px at common root sizes.
| Root size | 16px in rem |
|---|---|
| 16px (default) | 1rem |
| 12px | 1.3333rem |
| 14px | 1.1429rem |
| 18px | 0.8889rem |
| 20px | 0.8rem |
| 24px | 0.6667rem |
16px in CSS
Use 16px as the html root or body font size — the safest default.
html {
font-size: 16px; /* browser default */
}
body {
font-size: 1rem;
line-height: 1.5;
}FAQ
Is 16px the same as 1rem?
Yes, at the browser default root font size of 16px. If the root has been changed (some sites use html { font-size: 62.5% } or similar), the conversion changes — see the table above for 16px at other root sizes.
Will 16px scale with user font preferences?
No. Pixel values are absolute and ignore the user’s browser font-size preference. If you want 16px to scale when users enlarge their default font size, use 1rem instead — same visual size at the default root, but it grows or shrinks with the user’s setting.