font inspectorREM to PX converter
Convert rem values to pixels with your own root font size, with a reference table of common values.
font-size: 24px; /* 1.5rem at 16px */
How do you convert REM to PX?
Multiply the rem value by the root font size. Browsers default to a 16px root, so 1.5rem is 24px. If the site sets a different size on the html element, or the reader has changed their browser’s default, the result changes with it. That is the point of rem: text scales with the reader’s preference.
Going the other way? Use the PX to REM converter. For when to use each unit, see rem vs em vs px.
| REM | Pixels | REM | Pixels |
|---|---|---|---|
| 0.25rem | 4px | 1.75rem | 28px |
| 0.5rem | 8px | 2rem | 32px |
| 0.625rem | 10px | 2.25rem | 36px |
| 0.75rem | 12px | 2.5rem | 40px |
| 0.875rem | 14px | 3rem | 48px |
| 1rem | 16px | 3.5rem | 56px |
| 1.125rem | 18px | 4rem | 64px |
| 1.25rem | 20px | 4.5rem | 72px |
| 1.375rem | 22px | 5rem | 80px |
| 1.5rem | 24px | 6rem | 96px |
What is 1.5rem in pixels?
24px at the default 16px root. At a 10px root, as used by stylesheets that set html { font-size: 62.5% }, it is 15px.
Why does 1rem measure differently on a site I am inspecting?
The site has probably set a font size on the html element, or your browser’s default font size is not 16px. Check the computed font size of the html element in DevTools and enter it as the root.
Is rem the same as em?
No. Rem is always relative to the root element. Em is relative to the font size of the element itself, or of its parent when it is used for font-size.
See how real sites set their type.
Font Inspector shows the font, size, line height and spacing of any text on any website, then copies it as CSS. Free, no account.