Custom properties contain specific values to be reused in a document.
Custom property notation (e.g., --main-color:black;
) is used to set custom properties.
Declaration of custom property on the :root
pseudo-class allows for use where needed throughout a document.
The var()
function is used to access custom properties.
Example:
Declaring a custom property:
element {
--main-bg-color:brown;
}
Using the custom property:
element {
background-color:var(--main-bg-color);
}
Source:Developer.Mozilla
Top comments (0)