PX to REM | REM to Px Conversion chart
| Pixel | REM |
|---|---|
| 1px | 0.063rem |
| 2px | 0.125rem |
| 3px | 0.188rem |
| 4px | 0.250rem |
| 5px | 0.313rem |
| 6px | 0.375rem |
| 7px | 0.438rem |
| 8px | 0.500rem |
| 9px | 0.563rem |
| 10px | 0.625rem |
| 12px | 0.750rem |
| 14px | 0.875rem |
| 16px | 1rem |
| 18px | 1.125rem |
| 20px | 1.250rem |
| 22px | 1.375rem |
| 24px | 1.5rem |
| 25px | 1.563rem |
| 28px | 1.750rem |
| 30px | 1.875rem |
| 32px | 2rem |
| 35px | 2.188rem |
| 40px | 2.5rem |
| 45px | 2.813rem |
| 48px | 3rem |
| 64px | 4rem |
| 96px | 6rem |
| 128px | 8rem |
| 160px | 10rem |
| 176px | 11rem |
| 192px | 12rem |
| 208px | 13rem |
| 224px | 14rem |
| 256px | 16rem |
| 320px | 20rem |
| 480px | 30rem |
| 576px | 36rem |
| 768px | 48rem |
| 800px | 50rem |
| 960px | 60rem |
| 992px | 62rem |
| 1024px | 64rem |
| 1120px | 70rem |
| 1200px | 75rem |
| 1280px | 80rem |
| 1440px | 90rem |
| 1600px | 100rem |
| REM | Pixel |
|---|---|
| 0.01rem | 0.16px |
| 0.02rem | 0.32px |
| 0.04rem | 0.64px |
| 0.05rem | 0.80px |
| 0.06rem | 0.96px |
| 0.08rem | 1.28px |
| 0.1rem | 1.60px |
| 0.2rem | 3.20px |
| 0.4rem | 6.40px |
| 0.5rem | 8px |
| 0.8rem | 12.80px |
| 1rem | 16px |
| 2rem | 32px |
| 3rem | 48px |
| 4rem | 64px |
| 5rem | 80px |
| 6rem | 96px |
| 7rem | 112px |
| 8rem | 128px |
| 9rem | 144px |
| 10rem | 160px |
| 12rem | 192px |
| 14rem | 224px |
| 15rem | 240px |
| 18rem | 288px |
| 20rem | 320px |
| 22rem | 352px |
| 24rem | 384px |
| 26rem | 368px |
| 28rem | 448px |
| 30rem | 480px |
| 32rem | 512px |
| 35rem | 560px |
| 40rem | 640px |
| 45rem | 720px |
| 50rem | 800px |
| 65rem | 1040px |
| 70rem | 1120px |
| 76rem | 1216px |
| 82rem | 1312px |
| 85rem | 1360px |
| 90rem | 1440px |
| 92rem | 1472px |
| 94rem | 1504px |
| 96rem | 1536px |
| 98rem | 1568px |
| 99rem | 1584px |
Table of content
Pixel vs REM: How are they different?
Pixel and REM are both units of measurement that are used in web design. Pixel, also known as “px”, is a fixed unit of measurement that is based on the resolution of the device being used to view the content. REM is a relative unit of measurement that is based on the font size of the root element. This means that if the font size of the root element is changed, the size of the REM unit will also change.
One of the main benefits of using REM over pixels is that it can provide a more flexible and responsive design. Since the REM unit is based on the font size of the root element, it can adapt to changes in font size, making it a good choice for responsive design. On the other hand, pixels are fixed, and do not respond to changes in font size, making them less flexible.
Understanding EM and REM units
EM and REM are similar, but they are not the same. Both units are relative, meaning that they are based on the font size of the parent element. However, there is one key difference between the two. EM is based on the font size of the immediate parent element, whereas REM is based on the font size of the root element (usually the <html> tag).
The main advantage of using REM over EM is that it allows for more consistent sizing across different elements. Since REM is based on the root element, it does not change based on the font size of the parent element, making it more consistent. However, this can also be a disadvantage in some cases, as it can make it more difficult to make precise adjustments to the font size of individual elements.
Why is the px to rem calculation is based on the base pixel size?
The conversion from pixels to REMs is based on a base pixel size, which is typically the font size of the root element. This is because the REM unit is a relative unit that is based on the font size of the root element. By using the root element as the base, it provides a consistent starting point for all font sizes.
To calculate the REM value of a pixel size, you need to divide the pixel value by the base pixel size. For example, if the base font size is 16px, and you want to convert a pixel value of 24px to REMs, you would divide 24 by 16, giving you a value of 1.5 REMs.
How to use this tool to convert px to rem?
The PX to REM converter tool is a useful tool for web designers who want to quickly and easily convert pixel values to REM. To use a Px to REM conversion tool, follow these simple steps:
- Visit to our online tool website Tools360.net and search “PX to REM converter” OR Directly search on google “PX to REM Tools360”.
- Once you visit, then simply enter the pixel value that you want to convert into the REM value.
- And there you go, PX value will automatically get converted to REM.
- NOTE: You also can change the base font size in pixels. This is typically the font size of the root element, which is often set to 16px by default.
How to use this tool to convert rem to px?
- Simply click on this “⇆” swap icon to open REM to PX Converter tool.
- OR Search for “REM to PX Converter” in Tools360.net website.
