Too Long; Didn't Read
Variables let you set common values like colors and sizes in a single place then reference the variable when you need to use those values. Variables are part of the normal cascade of CSS properties. They are case-sensitive, so --foo and --Foo are not the same variable. The values of your variables can be many different things as basically any valid CSS value can be the value of a variable. You don’t need any build tools or pipelines; they are just part of what the browser uses.