カスタムプロパティ (–*): CSS 変数

接頭辞 — が付いたプロパティ名、例えば –example-name は、カスタムプロパティを表し、 var() 関数を用いて他の宣言の中で使用することができます。別ファイルにしても大丈夫です。

:root {
  --first-color: #16f;
  --second-color: #ff7;
}
#firstParagraph {
  background-color: var(--first-color);
  color: var(--second-color);
}
#secondParagraph {
  background-color: var(--second-color);
  color: var(--first-color);
}

参考サイト
https://developer.mozilla.org/ja/docs/Web/CSS/–*