:modal

The :modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().

Baseline Status: Achieved Widely Available on Mar 2, 2025 (Cross-browser Newly Available since Sep 2, 2022).

Desktop Browser Engine Support

Google Chrome

105

Supported

Mozilla Firefox

103

Supported

Apple Safari

15.6

Supported

Microsoft Edge

105

Supported

Mobile Browser Engine Support

Chrome Android

105

Firefox Android

103

Safari iOS

15.6

Specifications and References

Specification ↗ Feature XML ↗

MDN Browser Compat Data Keys:

css.selectors.modal ↗