8 rem equals 128 pixels (px) assuming the default browser font size of 16 pixels.
To convert rem units to pixels, we multiply the rem value by the root element’s font size in pixels. Because 1 rem equals 16 px by default, 8 rem is 8 times 16, which results in 128 px.
Conversion Tool
Result in px:
Conversion Formula
The formula to convert rem to pixels is:
pixels = rem × root font size (in pixels)
This works because rem units are relative to the root element’s font size, which browsers set to 16 px by default. So, multiplying rem value by 16 px gives the pixel equivalent.
Example:
- Given: 8 rem
- Root font size = 16 px
- Calculation: 8 × 16 = 128 px
- Result: 8 rem = 128 px
Conversion Example
- Example 1: Convert 3.5 rem to px
- Multiply 3.5 by 16 (root font size)
- 3.5 × 16 = 56
- So, 3.5 rem equals 56 px
- Example 2: Convert 0.75 rem to px
- 0.75 × 16 = 12
- 0.75 rem equals 12 px
- Example 3: Convert 12 rem to px
- 12 × 16 = 192
- 12 rem equals 192 px
- Example 4: Convert 1.25 rem to px
- 1.25 × 16 = 20
- 1.25 rem equals 20 px
- Example 5: Convert 5 rem to px
- 5 × 16 = 80
- 5 rem equals 80 px
Conversion Chart
The table below shows rem values from -17.0 to 33.0 and their equivalent pixel values based on 16 px root font size. You can find the px value by multiplying rem by 16.
| Rem | Pixels (px) | Rem | Pixels (px) | Rem | Pixels (px) | Rem | Pixels (px) |
|---|---|---|---|---|---|---|---|
| -17.0 | -272 | -7.0 | -112 | 3.0 | 48 | 13.0 | 208 |
| -16.0 | -256 | -6.0 | -96 | 4.0 | 64 | 14.0 | 224 |
| -15.0 | -240 | -5.0 | -80 | 5.0 | 80 | 15.0 | 240 |
| -14.0 | -224 | -4.0 | -64 | 6.0 | 96 | 16.0 | 256 |
| -13.0 | -208 | -3.0 | -48 | 7.0 | 112 | 17.0 | 272 |
| -12.0 | -192 | -2.0 | -32 | 8.0 | 128 | 18.0 | 288 |
| -11.0 | -176 | -1.0 | -16 | 9.0 | 144 | 19.0 | 304 |
| -10.0 | -160 | 0.0 | 0 | 10.0 | 160 | 20.0 | 320 |
| -9.0 | -144 | 1.0 | 16 | 11.0 | 176 | 21.0 | 336 |
| -8.0 | -128 | 2.0 | 32 | 12.0 | 192 | 22.0 | 352 |
| -7.0 | -112 | 3.0 | 48 | 13.0 | 208 | 23.0 | 368 |
| -6.0 | -96 | 4.0 | 64 | 14.0 | 224 | 24.0 | 384 |
| -5.0 | -80 | 5.0 | 80 | 15.0 | 240 | 25.0 | 400 |
| -4.0 | -64 | 6.0 | 96 | 16.0 | 256 | 26.0 | 416 |
| -3.0 | -48 | 7.0 | 112 | 17.0 | 272 | 27.0 | 432 |
| -2.0 | -32 | 8.0 | 128 | 18.0 | 288 | 28.0 | 448 |
| -1.0 | -16 | 9.0 | 144 | 19.0 | 304 | 29.0 | 464 |
| 0.0 | 0 | 10.0 | 160 | 20.0 | 320 | 30.0 | 480 |
| 1.0 | 16 | 11.0 | 176 | 21.0 | 336 | 31.0 | 496 |
| 2.0 | 32 | 12.0 | 192 | 22.0 | 352 | 32.0 | 512 |
| 3.0 | 48 | 13.0 | 208 | 23.0 | 368 | 33.0 | 528 |
Related Conversion Questions
- How many pixels are in 8 rem if the root font size is different?
- What is the pixel value for 8 rem on a mobile device?
- Does 8 rem equal 128 px always, or can it change?
- How can I convert 8 rem to px in CSS with custom root font size?
- What happens if I change the browser default font size for 8 rem?
- Is 8 rem larger or smaller than 8 em in pixels?
- Can 8 rem be negative, and what does that mean in pixels?
Conversion Definitions
rem: rem stands for “root em” and it is a relative measurement unit used in CSS. It measures sizes based on the root element’s font size, usually the <html> tag. Changing the root font size will affect all rem-based sizes throughout the webpage, allowing consistent scaling.
px: px means pixels, which are fixed-size units representing a single dot on a computer screen or device display. Pixels are absolute units in CSS, providing precise control over layout and size, but they don’t scale with user preferences or zoom like relative units do.
Conversion FAQs
Why does the rem to px conversion depend on the root font size?
Because rem units are defined relative to the root element’s font size, the pixel equivalent changes if the root font size is modified. For example, if the root font size is set to 20px instead of the default 16px, 1 rem equals 20 pixels, affecting all rem conversions accordingly.
Can the value of 8 rem be different in pixels on different browsers?
The default root font size is generally 16 pixels across most browsers, but users or developers can change it. If the root font size changes, 8 rem will convert to a different pixel value. So, the pixel value for 8 rem is not guaranteed to be the same everywhere if font settings are adjusted.
Is it better to use rem or px for responsive designs?
rem units are preferred for responsive designs because they scale with the root font size, which can be adjusted for different devices or user settings. Pixels provide fixed sizes that do not adapt, which can make layouts less flexible on varying screen sizes or accessibility preferences.
How do I find out what the root font size is if I want to convert rem to pixels?
You can check the root font size by inspecting the <html> element in developer tools of a browser. It is commonly set to 16px by default, but CSS or user settings might override it. Knowing the root font size is necessary for accurate rem to px conversion.
What happens if I use a negative rem value, like -8 rem?
Using negative rem values in CSS can produce negative pixel values when converted. This usually results in positioning or sizing elements off-screen or inverted layouts. While valid, negative rem values should be used carefully, as they can cause unexpected visual behavior.