CSS Custom Properties (Variables)

The var() function can be used to insert the value of a custom property.

The var() Function

Variables in CSS should be declared within a CSS selector that defines its scope. For a global scope you can use either the :root or the body selector.

The variable name must begin with two dashes (--) and is case sensitive!

The syntax of the var() function is as follows:

var(custom-name, value)

Example -

Example -