Understanding how to convert between REM and PX is essential for web designers and developers who aim to create responsive, accessible, and scalable designs. This tool solves the confusion around relative units like REM and provides an easy way to convert between REM and PX values.
Also, check out the Hex to Pantone and morse code translator.
📏 Quick REM ↔ PX Conversion Tables
REM to PX Table
REM | PX |
---|---|
0.75 | 12 |
1 | 16 |
1.25 | 20 |
1.5 | 24 |
1.75 | 28 |
2 | 32 |
2.5 | 40 |
3 | 48 |
4 | 64 |
5 | 80 |
6 | 96 |
7.5 | 120 |
10 | 160 |
PX to REM Table
PX | REM |
---|---|
2 | 0.125 |
10 | 0.625 |
12 | 0.75 |
16 | 1 |
20 | 1.25 |
24 | 1.5 |
28 | 1.75 |
30 | 1.875 |
32 | 2 |
40 | 2.5 |
48 | 3 |
64 | 4 |
80 | 5 |
96 | 6 |
120 | 7.5 |
What’s the Difference Between REM and PX?
PX (pixels) are absolute units that represent fixed values on the screen. REM (root em) is a relative unit that depends on the root font size of the document, making it more flexible and scalable.
Designers often use REM for creating responsive designs because it adapts to the user’s font size settings. PX is still helpful for precise, fixed layouts.
How to Convert Between REM and PX
To convert REM to PX, multiply the REM value by the root font size. For example, if the root font size is 16px, 1.5 REM equals 24px.
To convert PX to REM, divide the pixel value by the root font size. For instance, if the root font size is 16px, 32px equals 2 REM.