2 px is equal to 0.125 rem.
This is calculated by dividing the pixel value by the root font size, which is commonly 16 px in browsers. So, 2 pixels converted into rem units results in 0.125 rem.
Conversion Tool
Result in rem:
Conversion Formula
The formula to convert pixels (px) to rem units is:
rem = px / root font size
Since web browsers default the root font size to 16 pixels, you divide the pixel value by 16. This means 1 rem equals 16 pixels. The rem unit scales relative to the root font size, so when you change root font size, all rem values adjust automatically.
Example calculation for 2 px:
- Start with 2 pixels.
- Divide by 16 (default root font size): 2 ÷ 16 = 0.125.
- The result is 0.125 rem.
Conversion Example
- Convert 24 px to rem:
- Take 24 pixels.
- Divide by 16: 24 ÷ 16 = 1.5.
- Result is 1.5 rem.
- Convert 10 px to rem:
- Start with 10 pixels.
- Calculate 10 ÷ 16 = 0.625.
- So, 10 px equals 0.625 rem.
- Convert 5 px to rem:
- Take 5 pixels.
- Divide 5 by 16: 5 ÷ 16 = 0.3125.
- Thus, 5 px is 0.3125 rem.
- Convert 32 px to rem:
- Start with 32 pixels.
- Divide by 16: 32 ÷ 16 = 2.
- So, 32 px converts to 2 rem.
Conversion Chart
The table below shows pixel values from -23.0 to 27.0 and their equivalent rem values using the formula px ÷ 16. Negative pixel values convert to negative rem units, which can be useful in some CSS calculations or animations.
| Pixels (px) | Rem |
|---|---|
| -23.0 | -1.4375 |
| -22.0 | -1.3750 |
| -21.0 | -1.3125 |
| -20.0 | -1.2500 |
| -19.0 | -1.1875 |
| -18.0 | -1.1250 |
| -17.0 | -1.0625 |
| -16.0 | -1.0000 |
| -15.0 | -0.9375 |
| -14.0 | -0.8750 |
| -13.0 | -0.8125 |
| -12.0 | -0.7500 |
| -11.0 | -0.6875 |
| -10.0 | -0.6250 |
| -9.0 | -0.5625 |
| -8.0 | -0.5000 |
| -7.0 | -0.4375 |
| -6.0 | -0.3750 |
| -5.0 | -0.3125 |
| -4.0 | -0.2500 |
| -3.0 | -0.1875 |
| -2.0 | -0.1250 |
| -1.0 | -0.0625 |
| 0.0 | 0.0000 |
| 1.0 | 0.0625 |
| 2.0 | 0.1250 |
| 3.0 | 0.1875 |
| 4.0 | 0.2500 |
| 5.0 | 0.3125 |
| 6.0 | 0.3750 |
| 7.0 | 0.4375 |
| 8.0 | 0.5000 |
| 9.0 | 0.5625 |
| 10.0 | 0.6250 |
| 11.0 | 0.6875 |
| 12.0 | 0.7500 |
| 13.0 | 0.8125 |
| 14.0 | 0.8750 |
| 15.0 | 0.9375 |
| 16.0 | 1.0000 |
| 17.0 | 1.0625 |
| 18.0 | 1.1250 |
| 19.0 | 1.1875 |
| 20.0 | 1.2500 |
| 21.0 | 1.3125 |
| 22.0 | 1.3750 |
| 23.0 | 1.4375 |
| 24.0 | 1.5000 |
| 25.0 | 1.5625 |
| 26.0 | 1.6250 |
| 27.0 | 1.6875 |
Related Conversion Questions
- How many rems is 2 px in CSS?
- What is the rem equivalent of 2 pixels on a web page?
- How do I convert 2 px to rem with a different root font size?
- Why does 2 px equal 0.125 rem by default?
- Can 2 px be accurately converted to rem if root font size changes?
- Is 2 px to rem conversion always 0.125 rem for all browsers?
- How does the browser treat 2 px when using rem units in stylesheets?
Conversion Definitions
px: Px, short for pixels, is a unit of measurement used in digital imaging and web design. Pixels represent a single point on a screen, and their size can vary depending on the device’s screen resolution. They are absolute units, fixed in size, making them useful for precise layout control.
rem: Rem stands for “root em” and is a relative length unit in CSS. It measures sizes relative to the root element’s font size, usually the <html> tag. Using rem allows scaling elements consistently when the root font size changes, aiding accessibility and responsive design.
Conversion FAQs
Does the root font size always have to be 16px for rem conversion?
No, it doesn’t have to be 16px. Browsers set 16px as the default root font size, but developers can change it in CSS by modifying the font-size property on the <html> element. If the root font size changes, the rem values scale accordingly, so 2 px converted to rem would differ.
What happens if the root font size is set in percentages?
When the root font size is defined in percentages, like 62.5%, it changes the base pixel size the rem unit is relative to. For example, 62.5% of 16px equals 10px, so 1 rem equals 10 pixels. This makes converting px to rem different, and formulas should adjust to the new root font size value.
Can negative pixel values be converted to rem?
Yes, negative pixel values can be converted to rem by dividing the negative px value by the root font size, resulting in negative rem values. This can be useful in animations, positioning, or advanced CSS techniques, though it might cause unexpected layouts if not used carefully.
Why use rem instead of px for font sizes?
Rem units adapt to the root font size, making text scalable across devices and user settings like zoom or accessibility preferences. Px units are fixed and don’t respond to user changes, which can reduce readability. Using rem allows better control over responsive typography.
Is the conversion from px to rem affected by browser zoom?
Browser zoom doesn’t affect the px to rem conversion formula directly, but zooming changes the rendered size of elements on screen. Since rem is relative to root font size, zooming and user settings can influence how rem units appear visually, but the mathematical conversion remains the same.
