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.