CSS Unit Converter
Convert between PX, REM, and EM units with configurable root font size.
Result
16
16px
Default is 16px. Many sites use 14px or 18px.
The immediate parent element's font size. Used for EM conversions.
Quick Conversions
Calculation
1em × 16px (parent) = 16px
Convert 1em to px
This converter calculates the equivalent value of 1em (EM) in px (Pixels). Use the tool above to adjust the value, change units, or customize your root font size for more accurate calculations based on your site's configuration.
About EM vs Pixels
EM is relative to the parent element's font size. This conversion assumes a 16px parent; use the Parent Font Size slider above if your parent element has a different size.
When to Use This Conversion
- Converting a design mockup (often in PX) to a CSS-based responsive design using REM or EM.
- Calculating spacing and font scales when migrating from a PX-based codebase to REM-based.
- Understanding EM relationships within nested components.
- Verifying that responsive breakpoint sizes are correct in relative units.
Pro Tips
1. Set Your Root Font Size
If your site uses a non-standard root font size (e.g., 14px or 18px), update the Root Font Size slider for accurate REM conversions.
2. Use REM for Global Sizing
Apply REM to font sizes, line heights, and global spacing. Then adjust the root size in media queries to scale everything responsively.
3. Use EM for Component Padding/Margins
EM ensures buttons, cards, and other components scale proportionally to their own font size, keeping designs consistent.
4. Bookmark This Tool
Save this page in your browser for quick access. The URL updates when you change inputs, so you can share precise conversion examples with your team.