OSのテーマ設定に追従します。設定を切り替えると、この枠の中の配色も入れ替わります。

役割で名付けた変数

色は --surface--text-muted のように役割で持ちます。--gray-100 のような名前にすると、暗色テーマで「一番薄い灰色が一番濃い」という矛盾が起きます。

沈んだ面は --surface-2。明色では地より暗く、暗色では地より明るい。同じ変数名で逆向きの値を持てるのが、役割で名付ける利点です。
タグ