Convert PX to EM
Convert pixels to em units. EM is relative to the parent element's font size. Free online CSS unit converter with formula.
Formula: em = px ÷ parent font size
Quick example: 24px ÷ 16 = 1.5em (with 16px parent)
Value
Unit
px
px
px
px
pxSource
16pxrem
1remem
1emvh
1.4815vhvw
0.8333vwVisual Preview
16px
About This Conversion
EM units are relative to the font size of the parent element, making them useful for component-level scaling. Unlike rem (which references the root), em cascades — an em value inside a nested element compounds with its parent's font size. To convert pixels to em, divide the pixel value by the parent element's computed font size. This unit is ideal for padding and margins that should scale proportionally with text size within a component, such as button padding that grows with font size.
Frequently Asked Questions
What is the difference between EM and REM?
EM is relative to the parent element's font size and can compound with nesting. REM is always relative to the root (html) element's font size, providing more predictable sizing across the page.
When should I use EM instead of REM?
Use em when you want spacing to scale with the component's own text size (e.g., button padding). Use rem for consistent page-wide sizing that doesn't compound with nesting.
How do I convert PX to EM?
Divide the pixel value by the parent element's font size. If parent is 16px: 24px ÷ 16 = 1.5em. If parent is 20px: 24px ÷ 20 = 1.2em.