Easily convert pixels (PX) to REM with our free online PX to REM converter. REM (Root EM) is a font-relative unit commonly used in CSS for scalable and responsive designs. Use this tool to quickly calculate the REM equivalent of any pixel value and ensure consistent typography across your web projects.
Follow these simple steps to convert Pixels (PX) to REM:
The root element in an HTML document is the <html> tag, which defines the base font size for REM calculations in CSS.
There are three ways to apply font-size to the <html> element:
<html style="font-size: 18px;">
<style>
html {
font-size: 18px;
}
</style>
<link rel="stylesheet" type="text/css" href="styles.css">
html {
font-size: 18px;
}
The base font size on the root element determines REM calculations in CSS.
If the root font-size is 18px, and you need to convert 36px into REM:
REM = 36px / 18px
REM = 2
So, 36px is equal to 2rem when the root font-size is 18px.
| PX | REM |
|---|---|
| 4px | 0.25rem |
| 8px | 0.5rem |
| 12px | 0.75rem |
| 16px | 1rem |
| 20px | 1.25rem |
| 24px | 1.5rem |
| 32px | 2rem |
| 40px | 2.5rem |
| 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 |