@scope
The @scope at-rule allows you to limit the reach of your styles to a specific part of the page. This is a native alternative to things like 'CSS Modules' or 'Styled Components', letting you keep styles local without complex naming rules.
Syntax
/* Usage Example */
/* Styles inside only apply when inside a .article-body */
@scope (.article-body) {
img{
border-radius: 8px;
}
p{
font-size: 1.1rem;
}
}
@scope Browser support
Newly available
Since
2025 86% global usage
Since 2025 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
118+
146+
17.4+
118+