32 rem to px = 512px
32 rem equals 512 pixels at the default root font size of 16px. Adjust the root size below to recalculate.
What’s 32rem used for?
32rem (512px at default root) is another layout-scale value, equal to 512px — a common content-column width for medium-form articles, modal dialogs, or constrained-width landing-page sections. Tailwind's max-w-lg lands at 32rem.
How it works
To convert 32rem to pixels, multiply by the root font size: 32 × 16 = 512. The rem unit is relative to the root element’s font size, which browsers default to 16px.
32rem at different root sizes
If you’ve overridden the html root font size, the pixel equivalent of 32rem shifts. Here’s 32rem at common root sizes.
| Root size | 32rem in px |
|---|---|
| 16px (default) | 512px |
| 12px | 384px |
| 14px | 448px |
| 18px | 576px |
| 20px | 640px |
| 24px | 768px |
32rem in CSS
Use 32rem as a content max-width — 512px at the default root.
.prose {
max-width: 32rem; /* 512px at 16px root */
margin-inline: auto;
}FAQ
Is 32rem the same as 512px?
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 32rem at other root sizes.
Why use 32rem instead of 512px?
Because 32rem scales with the user’s browser font-size preference, and 512px 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.