PX to REM Converter

Browser default is 16px.

What is PX to REM Converter

A px to rem converter translates a CSS size between pixels and rem units. One rem equals the root font-size of the page, which browsers set to 16px by default, so 16px is 1rem and 24px is 1.5rem. Type a value in either field and the other updates live. Change the root font-size box if your project uses a different base (a common trick is setting the root to 62.5% so 10px equals 1rem).

How to use

  1. Set the root font-size if your project differs from the 16px default.
  2. Type a pixel value into the Pixels field to see the rem equivalent.
  3. Or type a rem value into the REM field to see the pixel equivalent.
  4. Copy either result with the copy icon next to the field.
  5. Click Clear to reset the fields and start a new conversion.

When to use it

Building a responsive layout and need your 24px heading in rem? Enter 24 and you get 1.5rem, ready to drop into your stylesheet. Switching a design from fixed pixels to scalable rem keeps type and spacing in step with the reader browser setting, so anyone who bumps their default font-size sees the whole layout grow with it instead of staying locked at your pixel values.

Frequently asked questions

How do I convert px to rem?

Divide the pixel value by the root font-size. With the default 16px root, 24px is 24 / 16 = 1.5rem, and 8px is 8 / 16 = 0.5rem. To go the other way, multiply the rem value by the root font-size: 1.25rem at a 16px root is 1.25 * 16 = 20px.

What is the default root font-size?

Browsers use 16px as the default root font-size, so this tool starts there. If your CSS changes the font-size on the html element (for example to 62.5%, which makes the root 10px), update the root font-size box so the conversion matches your project.

Why use rem instead of px in CSS?

rem units scale with the root font-size, which respects the size a reader has chosen in their browser settings. Sizing fonts, margins, and padding in rem lets the whole layout grow or shrink with that preference, which is better for accessibility than pixels that stay fixed.

Can I share this tool with my inputs pre-filled?

Yes. The URL updates automatically as you type. Copy it from the address bar or use the Share button, anyone who opens the link will see your exact inputs ready to go.

Related tools