CSS :root Selector

CSS :root selector in CSS is a pseudo-class that matches the root element of a document tree. In the case of HTML documents, :root represents the <html> element itself, so this selector is identical to the html element selector. But the :root selector have more specificity than HTML element selector.

Syntax

Declaring Global CSS variables

The main purpose of root selector is to declare variables in CSS. This will have a global access across every selectors in the stylesheet. Lets see an example.

Example

Supported Browsers

Selector
:root	4.0	9.0	3.5	3.2	9.6