Table of Contents

About

The :root tree pseudo-element selects the Root of all blocks in the page

If the document is an HTML document, the root is the HTML element

Example

 :root {    
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
};
Voila

Get all property of the HTML root element

HTML root element

var element = document.querySelector("html");
var style = window.getComputedStyle(element);
for (var prop in style) {
    let value=style.getPropertyValue(prop);
    if (value!=""){
        console.log(prop+":"+value);
    }
}