em (relative to base font size) to Pixels (CSS px) Converter
1 em equals 16 px, and 1 px equals 0.0625 em. Enter a value in either box to convert em (relative to base font size) to pixels (css px) and back. Formula: CSS defines 1 in = 96 px = 72 pt = 6 pc; rem and em = px / base font size (default 16 px).
· CalcFlow Editorial
1 em = 16 px
Results shown are estimates for informational purposes only. Nothing on CalcFlow is financial, tax, legal, or medical advice. Always consult a qualified professional before making important decisions.
em (relative to base font size) to Pixels (CSS px) Conversion Table
| em (relative to base font size) | Pixels (CSS px) |
|---|---|
| 8 em | 128 px |
| 10 em | 160 px |
| 12 em | 192 px |
| 14 em | 224 px |
| 16 em | 256 px |
| 18 em | 288 px |
| 24 em | 384 px |
| 32 em | 512 px |
| 48 em | 768 px |
Pixels (CSS px) to em (relative to base font size) Conversion Table
| Pixels (CSS px) | em (relative to base font size) |
|---|---|
| 8 px | 0.5 em |
| 10 px | 0.625 em |
| 12 px | 0.75 em |
| 14 px | 0.875 em |
| 16 px | 1 em |
| 18 px | 1.125 em |
| 24 px | 1.5 em |
| 32 px | 2 em |
| 48 px | 3 em |
Worked example: 10 em = 160 px. 24 px at a 16 px base is 24 / 16 = 1.5 rem. A 12 pt print font is 12 x 96 / 72 = 16 px.
Need other units? Open the full Typography and CSS Unit Converter.
Popular Typography Conversions
Formula
CSS defines 1 in = 96 px = 72 pt = 6 pc; rem and em = px / base font size (default 16 px)Understanding Typography Conversion
On the web, CSS fixes the reference pixel at 1/96 of an inch, a point at 1/72 of an inch and a pica at 12 points, so 1 inch is 96 px, 72 pt and 6 pc. Relative units such as em and rem scale with a base font size, which browsers set to 16 pixels by default. Using rem for type and spacing keeps a layout responsive to the reader's font preference.
Tips and Best Practices
- 1At the default 16 px base, 1 rem is 16 px and 0.75 rem is 12 px.
- 2Divide px by the base size for rem; multiply rem by the base size for px.
- 3Use rem for font sizes so users who raise their browser font size get larger text.
Real-World Example
24 px at a 16 px base is 24 / 16 = 1.5 rem. A 12 pt print font is 12 x 96 / 72 = 16 px.
Common Mistakes to Avoid
- Assuming 1 em always equals 16 px; em depends on the parent element font size, and the base here is adjustable.
- Treating a CSS pixel as a physical device pixel on high density screens.
- Using pt on screens when the design brief is in px.
How to Use
- Type a number in the em (relative to base font size) box.
- The Pixels (CSS px) result appears instantly; you can also edit the Pixels (CSS px) box to convert backwards.
- Use the swap button to reverse the direction and Copy result to copy the answer.
Frequently Asked Questions
How many pixels (css px) are in 1 em?
How many em (relative to base font size) are in 1 px?
What is the formula to convert em (relative to base font size) to pixels (css px)?
How many px is 1 pt?
Sources: CSS Values and Units Module Level 3/4 (W3C): 1in = 96px = 2.54cm, 1pt = 1/72in, 1pc = 12pt.