MEAN Cookbook

How to do it...

We can define two-color variables by defining them in our /src/styles.scss stylesheet:

$background-color: #585858;$text-color: #1E1E1E;html, body {  background-color: $background-color;  color: $text-color;}nav {  background-color: $text-color;  color: $background-color;}

A huge advantage with Sass variables over vanilla CSS is that we can always change the value of a variable we define later on to a different value, and it will update any property associated with it accordingly. If we suddenly decide that a different background color or text color is an improvement, we can make those changes in one place, and our styles will all be updated to work as expected.