SCSS позволяет переопределить значение переменной.
Сделать это можно так:
$color: white !default;
$color: red;
В этом случае мы устанавливаем цвет по умолчанию white и потом переопределяем его значением red.
«!default» делает возможным не учитывать порядок задания значений.
То-есть если написать наоборот:
$color: red;
$color: white !default;
поведение будет таким же, то-есть цвет будет красным.
Это может быть полезным для предварительного переопределения значений в сторонних библиотеках.
Допустим, нам нужно глобально подменить путь к шрифтам, которые были скачаны с помощью bower в папку «bower_components» либо изменить графическую схему в bootstrap.