Andrew's Digital Garden

Colour variables

Following the DRY principle, it's a good idea to use variables to store your colours in. These can aid in wide sweeping changes of a brand colour, or identifying when things are used.

CSS variables and SASS variables (or other compiled variables) both have their advantages. CSS variables are living in the browser, meaning that they can be changed on the fly. As SASS variables are compiled and a bit more complex, it's easier to run helper functions on them, such as lighten, darken, saturate, etc.

[[colour]] [[css]] [[design]] [[designsystem]]

Colour variables