Em to Pixels Converter
Em is a relative CSS unit for font size and other measurements. One em equals the font size of the element's parent. If the parent font size is 16px (the browser default), then 1em equals 16px, 2em equals 32px, and 0.5em equals 8px. Em units are powerful in responsive design because they scale with the parent element's size, making it easy to create flexible, accessible layouts that adapt to user preferences. The default base font size in most browsers is 16px, but users can change this in their settings, and developers can override it with CSS. This calculator converts em to pixels for any base font size. Enter the em value and specify the base font size (default 16px), and the calculator instantly shows the pixel equivalent. Common em values are included for reference: 0.75em (12px), 1em (16px), 1.25em (20px), 1.5em (24px), and 2em (32px) at 16px base. Use this converter to understand em-based designs, check calculations while coding, or convert between em and pixel measurements.
Conversion formula
Em to pixels:
pixels = em * base_font_size
For example, at 16px base font size:
1em = 1 * 16px = 16px
1.5em = 1.5 * 16px = 24px
2em = 2 * 16px = 32px
Common em to pixel conversions
| Em value | Pixels (at 16px base) | Common use |
|---|---|---|
| 0.5em | 8px | Very small text |
| 0.75em | 12px | Small text, labels |
| 0.875em | 14px | Small body text |
| 1em | 16px | Base font size |
| 1.125em | 18px | Slightly larger text |
| 1.25em | 20px | Body text (generous) |
| 1.5em | 24px | Subheading |
| 2em | 32px | Heading |
| 2.5em | 40px | Large heading |
| 3em | 48px | Display heading |
Em to pixels converter: frequently asked questions
What is an em in CSS?
An em (em) is a relative CSS unit equal to the font size of the current element's parent. If the parent font size is 16px, then 1em equals 16px. If the parent is 12px, then 1em equals 12px. This makes em units flexible and responsive.
What is the default base font size?
The default base font size in most browsers is 16px. However, users can change this in their browser settings. When designing with em units, assume a 16px base unless you explicitly set a different value on the html element.
How do I convert em to pixels?
The formula is simple: pixels = em * base_font_size. If you have 2em and the base font size is 16px, then 2em = 2 * 16px = 32px. This converter does this calculation for you.
Why use em units instead of pixels?
Em units are relative, making them more flexible and accessible. When users change their browser's font size preference, em-based designs scale appropriately. Em units also scale well in nested elements, making responsive design easier.
How do nested em units work?
Em units are relative to the parent element's font size. If a parent is 2em (32px at 16px base) and a child is 1.5em, the child equals 1.5 * 32px = 48px, not 1.5 * 16px. Each level multiplies by the parent's computed size.
Official sources
Reviewed by the CalculatorHub team, edited by James Graham, 14 June 2026. See our methodology.