PX to REM Converter: CSS Unit Calculator & Table
Instantly convert pixels to rem and vice-versa. Bi-directional syncing means you can type into either box. Use the dynamic lookup table below for quick reference.
| Pixels | REM |
|---|
PX to REM converter FAQ
PX (pixels) and REM (root em) are standard units of measurement used in web design and CSS. Pixels are absolute units that always remain the exact same physical size on a screen, which is great for precision but terrible for accessibility. REM units, on the other hand, are relative to the browser's default font size (the "root"). Using REM ensures that if a user increases their browser's default font size because they are visually impaired, your website's typography, spacing, and layout will scale up beautifully to match.
How to convert px to rem?
To convert pixels (px) to rem, divide the pixel value by your root font size. By default, most browsers use a root font size of 16px. For example, 24px / 16px = 1.5rem.
How to convert rem to px?
To convert rem to pixels (px), multiply your rem value by your root font size. If your root font size is 16px, then 2rem * 16px = 32px.
Is it better to use rem or px?
It is generally better to use REM for web design because it improves accessibility. REM units are relative to the user's browser font size settings, meaning your design will scale appropriately if a user needs larger text for readability. Pixels are absolute and do not scale.
When to use px vs rem?
Use REM for font sizes, padding, margins, and most layout elements so they scale with user accessibility settings. Use PX for small borders (e.g., 1px solid) or specific imagery/canvas dimensions where absolute sizing is strictly required.