REM to EM Converter

Convert Root EM (REM) to Parent-relative EM units.

2em

About REM to EM Converter

The REM to EM converter helps developers understand the relationship between root-relative (REM) and parent-relative (EM) units in CSS. While REM is always relative to the root element's font size, EM is relative to the parent element's font size. This converter requires both the root font size and the target parent font size to accurately translate REM values into EM values.

Formula

EM = (REM × Root Font Size) ÷ Parent Font Size

Examples

2rem (16px root, 16px parent) = 2em
2rem (16px root, 20px parent) = 1.6em
2rem (16px root, 12px parent) = 2.667em

Reference

  • • REM = relative to root <html> font-size
  • • EM = relative to parent element font-size
  • • When root = parent size, REM = EM
  • • EM compounds in nested elements, REM does not

Frequency Asked Questions

What's the difference between REM and EM?

REM is relative to root, EM is relative to parent. REM is consistent globally, EM compounds.

When is REM equal to EM?

When the parent's font size equals the root font size.

How to convert 1.5rem to EM with 20px parent?

1.5 × 16 = 24px. 24 ÷ 20 = 1.2em.

Should I use REM or EM for padding?

Use REM for consistent spacing, EM for padding that scales with font size.

Can I mix REM and EM?

Yes. Use REM for global consistency and EM for component-level scaling.