Cheatsheet for custom properties in css

To setup custom properties in CSS, use the code below:

:root {
  --my-color: red;
}
.item-to-style {
  color: var(--my-color);
}
Example use cases
Set the color theme for a page at the very top of the css file so when you want to make changes, the relevant code can be quickly found and edited.
Use the same properties for multiple places and have the ability to change the property in one place for all of the elements.