カスタムプロパティ(CSS変数)の命名ルール

プレフィックス –my- を付ける(理由: WordPressのコア変数とバッティングしないように)

カラー

–my-color-baseテキストに使用。基本的には黒
–my-color-primaryアクセントカラーに使用
–my-color-secondaryサブカラー1に使用
–my-color-tertiaryサブカラー2に使用
–my-color-borderボーダーに使用。基本的にはグレーや黒
–my-color-background背景に使用。基本的には薄いグレー

色数が多い場合は、変数名を考えるのが困難なため具体的な色名を付けることを許容する。

–my-color-redテキストに使用する赤
–my-color-background-red薄い赤