CSS Selector Level 4 » Scope pseudo-class

This pseudo-class is called scope pseudo-class and represents any element that is in the contextual reference element set. If the contextual reference element set is empty, :scope is equivalent to :root.


:scope {
    background-color: gray;


:scope {
    /* declarations */

In this example the :scope is equivalent to :root and will select the <html> element. The scoped style will be applied to its parent element (as reference) too.

Try example in CodePen

Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop Yes (20) Yes (21) Yes (7) No No Yes (15)
Mobile No Yes (25) Yes (7) No No No

Usage statistics (Alexa Top 1,250,000 sites)

Please wait a moment, the comments start loading now...