Ответ 1
По умолчанию Sass не будет преобразовывать литеральные значения цвета из своих шестнадцатеричных значений, если вы не заставляете Sass интерполировать с помощью #{} или переменной.
Использование интерполяции вернет версию "to_sass" интересующего вас значения. Например, #{ #fff } будет интерполировать на "белый". Это также происходит во время замены переменных: цветные литералы переводятся в объекты Color при использовании в качестве переменных, а затем "to_sass" в вашу таблицу стилей.
Кроме того, вы можете указать опцию стиля compressed, которая вернет менее байтовую версию (т.е. red вместо #f00). Поскольку white имеет длину 5 символов, а #fff - всего 4, ваше правило вместо этого заменяется на #fff.
Невозможно отключить обратное преобразование цвета HTML4 при использовании переменных. В процессе работы вы можете объявлять цветовые переменные в виде строки, а затем использовать в стилях с помощью функции unquote().
$color: '#fff';
.white { color: unquote($color) }