16 px equals 1 rem based on the default browser font size of 16 pixels.
The conversion from pixels (px) to rem units depends on the root font size, which is commonly set to 16 pixels by browsers. Dividing the pixel value by 16 gives the equivalent rem value.
Conversion Tool
Result in rem:
Conversion Formula
The formula for converting pixels to rem is:
rem = px ÷ root font size (usually 16)
This works because rem units are relative to the root element’s font size. If the root font size is 16 pixels, dividing any pixel value by 16 converts it into rem.
Example:
- Given 16 px, and root font size 16 px
- 16 ÷ 16 = 1 rem
- So, 16 px equals 1 rem
Conversion Example
- Convert 24 px to rem:
- Divide 24 by 16
- 24 ÷ 16 = 1.5 rem
- Result is 1.5 rem
- Convert 32 px to rem:
- Divide 32 by 16
- 32 ÷ 16 = 2 rem
- Result is 2 rem
- Convert 8 px to rem:
- Divide 8 by 16
- 8 ÷ 16 = 0.5 rem
- Result is 0.5 rem
- Convert 48 px to rem:
- Divide 48 by 16
- 48 ÷ 16 = 3 rem
- Result is 3 rem
- Convert 10 px to rem:
- Divide 10 by 16
- 10 ÷ 16 = 0.625 rem
- Result is 0.625 rem
Conversion Chart
This chart shows pixel values from -9.0 to 41.0 with their rem equivalents. Negative values, while unusual, are included for completeness. Use this chart to quickly find the rem value by dividing the px by 16.
| Pixels (px) | Rem |
|---|---|
| -9.0 | -0.5625 |
| -8.0 | -0.5 |
| -7.0 | -0.4375 |
| -6.0 | -0.375 |
| -5.0 | -0.3125 |
| -4.0 | -0.25 |
| -3.0 | -0.1875 |
| -2.0 | -0.125 |
| -1.0 | -0.0625 |
| 0.0 | 0 |
| 1.0 | 0.0625 |
| 2.0 | 0.125 |
| 3.0 | 0.1875 |
| 4.0 | 0.25 |
| 5.0 | 0.3125 |
| 6.0 | 0.375 |
| 7.0 | 0.4375 |
| 8.0 | 0.5 |
| 9.0 | 0.5625 |
| 10.0 | 0.625 |
| 11.0 | 0.6875 |
| 12.0 | 0.75 |
| 13.0 | 0.8125 |
| 14.0 | 0.875 |
| 15.0 | 0.9375 |
| 16.0 | 1 |
| 17.0 | 1.0625 |
| 18.0 | 1.125 |
| 19.0 | 1.1875 |
| 20.0 | 1.25 |
| 21.0 | 1.3125 |
| 22.0 | 1.375 |
| 23.0 | 1.4375 |
| 24.0 | 1.5 |
| 25.0 | 1.5625 |
| 26.0 | 1.625 |
| 27.0 | 1.6875 |
| 28.0 | 1.75 |
| 29.0 | 1.8125 |
| 30.0 | 1.875 |
| 31.0 | 1.9375 |
| 32.0 | 2 |
| 33.0 | 2.0625 |
| 34.0 | 2.125 |
| 35.0 | 2.1875 |
| 36.0 | 2.25 |
| 37.0 | 2.3125 |
| 38.0 | 2.375 |
| 39.0 | 2.4375 |
| 40.0 | 2.5 |
| 41.0 | 2.5625 |
Related Conversion Questions
- How many rems equal 16 pixels in CSS?
- What rem value corresponds to 16 px on different root font sizes?
- Why does 16 px convert exactly to 1 rem by default?
- How to convert 16 px to rem if the root font size changes?
- Is 16 px always equal to 1 rem when designing responsive layouts?
- How does browser default font size affect 16 px to rem conversion?
- What happens when converting 16 px to rem on mobile devices?
Conversion Definitions
px (pixel): A pixel is the smallest unit of measurement on screens, representing a single point in a digital image or display. Pixels are absolute units, meaning they correspond to a fixed number of dots on the screen, though their physical size may vary on different devices and resolutions.
rem (root em): Rem is a CSS unit relative to the font size of the root element (usually the html tag). Unlike px, rem scales with the root font size, allowing for flexible and scalable designs that adjust automatically when user or browser settings change.
Conversion FAQs
Can the root font size affect the 16 px to rem conversion?
Yes, if the root font size is changed from its default 16 pixels, the rem value for 16 px will also change. For example, if root font size becomes 20 px, then 16 px converts to 16 ÷ 20 = 0.8 rem, not 1 rem.
Why use rem instead of px for sizing?
Rem allows sizes to scale relative to the root font size, which helps with accessibility and responsive design. It means when users adjust their browser font size, elements sized in rem will scale accordingly, unlike px which remains fixed.
Is 16 px equal to 1 rem in all browsers?
Mostly yes, since browsers default root font size to 16 px. However, users can change browser settings or CSS can override root font size, so 16 px might not always equal 1 rem in every environment.
Can negative pixel values be converted to rem?
While uncommon, negative px values can be divided by the root font size to get negative rem values. This might be used in CSS for positioning or offsets, but should be applied carefully as it may cause unexpected layouts.
What happens if root font size is set in rem itself?
If root font size is declared in rem, it creates a circular reference and browsers usually fallback to default. It’s recommended to set root font size in absolute units like px or percentages to avoid confusion in conversions.