An em in CSS is a scalable unit of measurement that defines the size of an element relative to its parent's font size. Unlike absolute units such as pixels (px) or points (pt), an em dynamically adapts its size based on the context.
For example, if a page’s font size is 14pt, 1em scales to match, becoming equivalent to 14pt. Ems adjust proportionally, meaning 2em doubles as 28pt, and 0.5em halves as 7pt.
The inherent cascading nature of ems allows them to adjust automatically in response to changes in a parent element’s font size. This adaptability lets web developers adjust text sizes across a website by modifying just one (parent) font size.
Web developers and designers use ems thanks to their scalability, flexibility, and mobile-friendliness. They also enable responsive designs, as elements set in ems seamlessly adapt to different screen sizes and resolutions.
Get the best, coolest, and latest in design and no-code delivered to your inbox each week.