1.25 rem to px = 20px
1.25 rem equals 20 pixels at the default root font size of 16px. Adjust the root size below to recalculate.
What’s 1.25rem used for?
1.25rem (20px at default root) is the standard size for lead paragraphs, large body text, and small headings. It's the natural step up from 1rem body when you want emphasis without going full heading. Used as spacing, it's a comfortable 'medium' padding for cards and form rows.
How it works
To convert 1.25rem to pixels, multiply by the root font size: 1.25 × 16 = 20. The rem unit is relative to the root element’s font size, which browsers default to 16px.
1.25rem at different root sizes
If you’ve overridden the html root font size, the pixel equivalent of 1.25rem shifts. Here’s 1.25rem at common root sizes.
| Root size | 1.25rem in px |
|---|---|
| 16px (default) | 20px |
| 12px | 15px |
| 14px | 17.5px |
| 18px | 22.5px |
| 20px | 25px |
| 24px | 30px |
1.25rem in CSS
Use 1.25rem for a lead paragraph or comfortable reading body.
.lead {
font-size: 1.25rem; /* 20px */
line-height: 1.6;
}FAQ
Is 1.25rem the same as 20px?
Yes, at the browser default root font size of 16px. If the root has been changed (some sites use html { font-size: 62.5% } or similar), the conversion changes — see the table above for 1.25rem at other root sizes.
Why use 1.25rem instead of 20px?
Because 1.25rem scales with the user’s browser font-size preference, and 20px does not. If a user enlarges their default font size for accessibility, anything sized in rem scales proportionately — including this value. Use rem for type and type-adjacent properties; reach for px only when the value must stay fixed regardless of user settings.