@scope

Use With Caution Updated: Dec 19, 2025

Enables scoped styling with upper and lower boundaries, where proximity to defined scopes affects which rules win.

Baseline:
Newly
Functional:
Progressing
Usage:
Cross-Context

Global @scope cannot cross the shadow boundary to apply to shadow elements. Within shadow DOM, @scope works with :host and :host() as the scoping root, and implicit @scope (without a boundary) correctly scopes to the shadow root. Note that ::slotted() within @scope lacks test coverage and may have inconsistent support.

Ranked caution due to limited real-world testing with shadow DOM. While WPT tests pass and Firefox 131+ completes cross-browser support, some edge cases like ::slotted() in @scope remain unverified.

Shadow DOM Related Issues

:scope resolves to :host in shadow trees

Resolved to work, but browser support is lagging and WPT expect failure

Stable

:scope and featureless elements

Resolved that :scope is a valid ref to :host within @scope (:host), available cross-browser

Stable
Web Platform Test
Chrome 147
Edge 146
Firefox 149
Safari 26.4
n
WPT sources: scope-shadow, scope-shadow-sharing, scope-pseudo-in-shadow