Cacher is the code snippet organizer for pro developers

// Define custom color name.
$my-red: #ee3333;
$my-blue: #3333ee;

// Then assign thme to role or context based name variables.
$header-bg: $my-red;
$header-active-fg: $my-blue;

// Bind them to elements finally.
.header {
  background-color: $header-bg;
}
 
.header .active {
  color: $header-active-fg;
}