PX to REM Converter
REM stands for "root em" and is relative to the root font size (default 16px in most browsers). To convert px to rem: divide by base font size. 16px / 16 = 1rem. 24px / 16 = 1.5rem. To convert rem to px: multiply by base font size. 2rem × 16 = 32px. Using rem units makes your design scale with user font preferences.
Convert pixels (px) to rem and rem to px with a configurable base font size. Bulk convert multiple values at once, reference common size mappings from 12px to 64px, and preview text at any size. Supports common base sizes: 14px, 16px, and 18px.
Works OfflineDark ModeNo Ads
Settings
px
Convert
px
1
remLive Preview (16px)
The quick brown fox jumps over the lazy dog
Bulk Convert
Paste multiple px values separated by spaces, commas, or new lines.
Reference Table (Base: 16px)
| Pixels (px) | REM | |
|---|---|---|
| 12px | 0.75rem | |
| 14px | 0.875rem | |
| 16px | 1rem | |
| 18px | 1.125rem | |
| 20px | 1.25rem | |
| 24px | 1.5rem | |
| 28px | 1.75rem | |
| 32px | 2rem | |
| 36px | 2.25rem | |
| 40px | 2.5rem | |
| 48px | 3rem | |
| 56px | 3.5rem | |
| 64px | 4rem |
How to Use
- Enter your value in the input field
- Click the Calculate/Convert button
- Copy the result to your clipboard
Frequently Asked Questions
- What is the difference between PX and REM in CSS?
- PX (pixels) is an absolute unit that stays the same size regardless of user settings. REM (root em) is a relative unit based on the root element's font size (typically 16px by default). Using rem allows your layout to scale when users change their browser font size, improving accessibility.
- How do I convert PX to REM?
- Divide the pixel value by the base font size. With a 16px base: 24px ÷ 16 = 1.5rem, 32px ÷ 16 = 2rem, 12px ÷ 16 = 0.75rem. If your base font size is different (e.g., 14px), divide by that value instead.
- How do I convert REM to PX?
- Multiply the rem value by the base font size. With a 16px base: 1.5rem × 16 = 24px, 2rem × 16 = 32px, 0.75rem × 16 = 12px. The base font size is set on the html element in your CSS.
- What base font size should I use?
- The browser default is 16px and is the most common choice. Some designers prefer 14px for data-dense UIs or 18px for content-heavy sites. The key is consistency—set it once on the html element and use rem everywhere else.
- Why should I use REM instead of PX?
- REM units respect user font size preferences, improving accessibility for visually impaired users. They also make responsive design easier—changing the root font size at different breakpoints scales your entire layout proportionally.
- What is the difference between EM and REM?
- EM is relative to the parent element's font size, which can compound (1.2em inside 1.2em = 1.44× the root size). REM is always relative to the root (html) element's font size, making it more predictable. REM is generally preferred for consistent sizing.