Skip to main content

Converter · CSS unit tool

REM to PX converter

Rebuild absolute pixels when designers or stakeholders still think in PX: px = rem × rootFontSize. At a 16px root, 1.5rem renders as 24px. The calculator below lets you match any root size your project uses.

rem

Enter the REM value first.

Calculation base

px

Usually html { font-size }

Result

24.000 px

1.5rem × 16px = 24.000px

Keyboard tip: press Tab or Shift+Tab to switch fields.

The REM to PX formula

Multiply the rem value by the computed root font-size: px = rem × rootPx. It is the exact inverse of PX → REM, so a clean round trip returns your original number.

Quick reference at a 16px root: 0.5rem → 8px, 0.75rem → 12px, 1rem → 16px, 1.25rem → 20px, 1.5rem → 24px, 2rem → 32px.

When you need pixels back

Design QA: comparing a Figma spec measured in pixels against REM values in code to confirm a component matches the mockup.

Debugging: checking how a minimum font clamp or a media-query threshold actually resolves on a given device once the root size is known.

Copy-ready examples

Verify a heading size
css
/* 1.75rem × 16 = 28px */
h1 { font-size: 1.75rem; } /* renders 28px */

Frequently asked questions

What is the formula for REM to PX?
Use px = rem × root font-size. Example: 1.5rem × 16 = 24px.
Why do REM values map to different pixels in different projects?
Because each project can use a different root font-size, and user settings can alter computed root size.
Should I round pixel results?
For design docs, rounding to 2 decimals is usually enough. Keep one rounding policy across your token table.
Can I use this for accessibility QA?
Yes. Convert token values and verify rendered sizes under zoom and larger default font settings.
Is rem to px converter free to use?
Yes. UnitCraft calculators are free and run entirely in your browser.