<rem>
A CSS unit that is relative to the font-size of the root element (usually the <html> tag). Unlike 'em', it doesn't change based on the parent's font size, making scaling much more predictable.
Syntax
/* Usage Example */
html {
font-size: 16px;
}
.my-text{
/* This will be exactly 32 pixels regardless of where it's nested */
font-size: 2rem;
}
<rem> Browser support
Newly available
Since
2024 86% global usage
Since 2024 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
125+
118+
15.4+
125+