1.8 rem equals 28.8 pixels (px) assuming the root font size is 16px.
Table of Contents
Rem units scale relative to the root element’s font size, which is often 16 pixels by default in most browsers. To convert rem to pixels, you multiply the rem value by the root font size in pixels.
Conversion Tool
Result in px:
Conversion Formula
The formula to convert rem to pixels is: pixels = rem × root font size. The root font size mostly defaults to 16px in browsers, but can change if overridden.
This formula works because rem is a unit relative to the root element’s font size; multiplying by that size gives an absolute pixel value.
Example for 1.8 rem:
- Identify root font size: 16px
- Multiply rem value by root font size: 1.8 × 16 = 28.8
- Result: 28.8px
Conversion Example
- 2.5 rem to px
- Root font size is 16px.
- Multiply: 2.5 × 16 = 40.
- Result: 40px.
- 0.75 rem to px
- Root font size 16px.
- Calculate 0.75 × 16 = 12.
- Result: 12px.
- 3.2 rem to px
- Root font size 16px.
- Multiply 3.2 × 16 = 51.2.
- Result: 51.2px.
- 1.1 rem to px
- Root font size 16px.
- Multiply 1.1 × 16 = 17.6.
- Result: 17.6px.
- 4 rem to px
- Root font size 16px.
- Calculation: 4 × 16 = 64.
- Result: 64px.
Conversion Chart
| rem | px |
|---|---|
| -23.2 | -371.2 |
| -20.0 | -320.0 |
| -15.5 | -248.0 |
| -10.0 | -160.0 |
| -5.3 | -84.8 |
| -1.0 | -16.0 |
| 0 | 0 |
| 1.2 | 19.2 |
| 5.5 | 88.0 |
| 10.0 | 160.0 |
| 15.8 | 252.8 |
| 20.0 | 320.0 |
| 26.8 | 428.8 |
Use this chart to quickly find px equivalents of rem values by multiplying rem by 16px. Negative values represent sizes smaller than the root font size, positive values larger.
Related Conversion Questions
- How many pixels is 1.8 rem on a 16px base font size?
- What is the pixel value of 1.8 rem if the root font size is changed to 18px?
- Can 1.8 rem be converted to pixels for responsive design?
- Why does 1.8 rem equal 28.8 pixels in CSS?
- How do I convert 1.8 rem to px using JavaScript?
- Does 1.8 rem always equal the same pixel value across browsers?
- What is the formula to convert 1.8 rem to pixels in CSS?
Conversion Definitions
rem: Rem stands for “root em,” a CSS unit that measures relative size to the root element’s font size. Unlike em units that depend on the parent element, rem always base on the HTML root font size, making scaling consistent across a webpage.
px: Px is short for pixels, an absolute unit representing a single dot on a screen. Pixels provide fixed size values that do not change depending on elements or user settings, offering precise control over layout and typography.
Conversion FAQs
Can the root font size vary, affecting the 1.8 rem to px conversion?
Yes, root font size can be changed in CSS (like setting html { font-size: 18px; }). When that happens, 1.8 rem will multiply by the new root size. So if root is 18px, 1.8 rem equals 32.4px instead of 28.8px.
Why use rem instead of px for font sizes?
Rem units allow better scalability and accessibility because they reference root font size. If users change browser default font size, text sized in rem adjusts accordingly, while px stays fixed, which can cause readability issues.
Is the conversion affected by zoom or device pixel ratio?
Zooming a page or different device pixel ratios change how pixels appear visually but not the raw conversion. 1.8 rem times root font size always gives the pixel value in CSS, but actual on-screen size depends on display settings.
How do I convert rem values to px in JavaScript?
You can use getComputedStyle(document.documentElement).fontSize to get root font size in pixels, then multiply by rem values. For example: parseFloat(getComputedStyle(document.documentElement).fontSize) * 1.8.
Does 1.8 rem correspond to the same pixel value on all websites?
Not necessarily, because root font size can be different on each website or overridden by user settings. Without knowing root font size, 1.8 rem can’t be converted to an exact pixel number universally.