Today I learned that CSS variables exist. CSS variables are basically CSS properties that can be applied generically like every other CSS definition to elements. But they start with two dashes -- and a case-sensitive variable name, like --my-variable: 10px;. To read them as value for another property, you use the var() function. For example: font-size: var(--my-variable); This allows to apply them almost as easy as SASS or SCSS variables to around your web pages, just that they are actual CSS and replaced by the CSS rendering process at runtime and not like the SASS compiler at build time.

I learned about this due to the awesome zine by Julia Evans which even does a way better job at explaining it than I can do here. I definitely recommend to check that one out.