Web platform features explorer - Shadow DOM

Web platform features explorer

Shadow DOM allows you to attach encapsulated "shadow" DOM trees to elements. A shadow DOM tree is a separate component, isolated from the scripts and styles in other parts of the document. This is a part of Web Components.

Status

Baseline Widely Available (since 2022-07-15)

MDN documentation

Using shadow DOM

Specifications

DOM (#shadow-trees), from DOM Workstream (WHATWG).

Browser support (view on caniuse.com)

Chrome 53 Released on 2016-08-31
Chrome Android 53 Released on 2016-09-07
Edge 79 Released on 2020-01-15
Firefox 63 Released on 2018-10-23
Firefox for Android 63 Released on 2018-10-23
Safari 10 Released on 2016-09-20
Safari on iOS 10 Released on 2016-09-13

Surveys

Web Platform Tests (WPT)

View the latest WPT test results for this feature

View as JSON | Edit this feature | Report an issue | Web-features entry: source, dist