Sass変数

Sassで変数を使用して、コード全体で値を保存して再利用します。

$box-bgcolor: #FF8100;
$box-border: 4px dashed yellow;

.box {
  background-color: $box-bgcolor;
  border: $box-border;
}

結果

上記のスニペットは、次のCSSを生成します。

.box {
  background-color: #FF8100;
  border: 4px dashed yellow;
}