CSS Units
  • Free forever
  • No sign-up
  • Instant results

REM to PX Converter

Got a REM value and need to know what it renders to in pixels? Enter the REM value and your project's root font size and get the exact pixel equivalent back in one step.

Pixel value

When would you use this?

Sometimes you're working in the browser dev tools, you see a value like 1.5rem, and you need to know what that actually is in pixels. Or your designer has given you a pixel spec and you want to sanity-check what your REM value renders to. This converter goes the other direction. Type in a REM value, set the root font size your project uses, and get the pixel equivalent straight back.

Common REM → PX values (16px root)

REM Pixels Common use
0.625rem 10px Small labels
0.75rem 12px Caption / meta text
0.875rem 14px Secondary text
1rem 16px Body text (browser default)
1.125rem 18px Large body / small heading
1.25rem 20px Lead text
1.5rem 24px H3 / subheadings
2rem 32px H2
2.5rem 40px H1 / display
3rem 48px Hero headings
4rem 64px Large display type

Common Questions

How do I convert REM to PX?

Why is REM to PX conversion useful?

What is the difference between REM and EM?

What root font size should I use?