To Clean up Your Code – CSS Variables Finally Landing in Chrome

Designers who have developed any size Website have had this issue: when you have to change one of your image’s hues it’s no simple accomplishment, requiring a hazardous pursuit and replace or hunting down every instance of its use.

To get around the clutter, most designers have switched to utilizing pre-processors like SASS or LESS which support creating variables by converting them when the processor is keep running over your code.

The issue is that this is not done at runtime with these libraries, so you’re not ready to change these colors progressively without recompiling your stylesheets.

Chrome 49 is getting full support for CSS variables so designers will ready to characterize a variable to be utilized all through their code and can be changed in realtime — and doesn’t require any extra compiling.

Developers can now declare a variable by using double dashes, for example ‘ – primary-color: #ccc‘ and then call them by using the var() function elsewhere. Chrome also supports using these new custom variables in JavaScript without any issues.

CSS variables are very new though have been in the works for years – but they’re not widely supported yet. Only Chrome 49, Firefox 43+, Safari 9.1 and iOS 9.3 support the standard with no roadmap for Microsoft Edge, Opera or Android.

Still, given that Chrome is used by more than half of people online, it’s likely to quickly gain momentum among other browsers. (Source by – The Next Web)