REM to PX Converter

How rem to px conversion works

One rem equals the font size of the root element, which is the html element. To get pixels, multiply the rem value by the root font size:

px = rem x root font size
1.5rem x 16px = 24px
2rem x 18px = 36px

Browsers start with a root font size of 16px, so 1rem is 16px unless your CSS or the reader settings change it.

Check your own root size

Press Use my browser size and the tool reads the root font size your browser is using right now. If you or your readers have raised the default text size in browser settings, rem values grow with it, while pixel values do not. That is the main reason rem is recommended for text.

The 62.5 percent trick

Some stylesheets set html { font-size: 62.5% } so that the root becomes 10px and 1.6rem equals 16px. If your project does this, enter 10 as the root size. The percentage keeps the reader preference, unlike a fixed 10px value.

Quick reference at 16px

• 0.5rem = 8px
• 0.75rem = 12px
• 1rem = 16px
• 1.25rem = 20px
• 1.5rem = 24px
• 2rem = 32px
• 3rem = 48px

Need the reverse? Use the px to rem converter, which can also convert a whole block of CSS. To build spacing and type scales, open the rem calculator. For background, read px vs rem, and compare with the em to px converter.