【Visual Studio SCSSのエラー】Invalid CSS after ~: expected expression was “#カラーコード”

プログラミング

2023.03.09

Visual StudioでSCSSのカラーコードを設定した変数を宣言した際に、下のようなエラーが出たので、対処法を備忘録として記します。

エラーの現象

重大度レベルコード説明プロジェクトファイル行抑制状態
エラー 0 Invalid CSS after “$greenTag-color:”: expected expression (e.g. 1px, bold), was “#92BF2550;”

要するにgreenTag-colorという変数に#92BF2550だけだと入れられませんよといった内容でした。

でも、下のように

$yellowTag-color: #FFDB00;
$yellowTag-color50: #FFDB0050;
$redTag-color: #DA5066;
$redTag-color50: #DA506650;

と書いてもエラーは出ませんでした。

rgba関数を使用することで回避出来ました。

$greenTag-color50: rgba(146, 191, 37, 0.5);

参考になれば幸いです。また、原因をご存知の方はコメントで教えてくださると助かります。