text_fieldsDev Tool

PX to REM Converter

Convert pixels to rem and rem to pixels. Set your base font size and get instant results.

settings Root font size (base)
px
Pixels (px)
px
swap_horiz
Root EM (rem)
rem

Quick Reference Table

Click any row to use that value
Pixels (px)REMCommon use

Frequently Asked Questions

rem (root em) is a CSS unit relative to the root element's font size — the html element. If the root font size is 16px, then 1rem = 16px, 0.5rem = 8px, and 2rem = 32px. Unlike em which is relative to the parent element, rem is always relative to the root, making it predictable and consistent.
Using rem for font sizes and spacing makes your design accessible and scalable. When users increase their browser's default font size (a common accessibility setting), rem-based layouts scale correctly while pixel-based layouts don't. Rem also makes global size adjustments easy — change the root font size and everything scales proportionally.
Most browsers default to 16px for the root font size, so 1rem = 16px by default. Users can change this in browser settings. You can also override it in CSS: html { font-size: 16px; }. The 16px default is what this converter uses unless you change the base value above.
Setting html { font-size: 62.5%; } changes the root font size to 10px (62.5% of the browser's 16px default). This makes rem math trivial: 1rem = 10px, 1.6rem = 16px, 2.4rem = 24px. Set the base to 10 in this converter to calculate values for this pattern.

About the PX to REM Converter

Convert pixel values to rem units and back, based on a configurable root font size (default 16px). Shows a conversion table for common sizes at once so you can reference multiple values without converting each one individually. Essential for accessible CSS where rem units scale with the user's browser font preference.