You guys, I could not believe my eyes when I read that plain old regular CSS will soon have variables. That’s right–no preprocessors needed!
Yes, you can use SASS or LESS and a preprocessor and do all sorts of fancy and useful things. But that’s not really the point.
The point is that with plain old regular CSS you can define a variable, say your page’s background color, and use that variable name instead of the hexadecimal code or rgb values each time. It’s just so simple and glorious! There is also a calc() function, and many other fun things.
Currently, Chrome 49, Firefox 42, Safari 9.1, and iOS Safari 9.3 all support custom properties, so it may be a while before this is universal and accessible to most users, but it’s certainly one the way!
To learn more, I found these resources super helpful:
And to throw some controversy into the mix, not all coders are pumped about CSS Variables. Here’s one post to that effect: