CSS の @property ルールを使うことで、CSS のカスタムプロパティ を定義できます。カスタムプロパティを定義することでプロパティの構文チェック、初期値の設定、プロパティが値を継承するかどうかの設定が可能になります。 @property --my-color { /** red や #fff のように色のキーワードまたはカラーコードを代入可能 */ syntax: "<color>"; inherits: false; initial-value: red; } /* カスタムプロパティを使用 */ .my-element { --my-color: blue; color: var(--my-color); } @property ルールのメリット @property ルールを使うことで、以下のようなメリットがあります。 カスタムプロパティによりコードをドキュメント化する 誤
![CSS の `@property` ルールでカスタムプロパティを定義する](https://cdn-ak-scissors.b.st-hatena.com/image/square/c7fe1bcf570519c44583d217c2e3bb736119449c/height=288;version=1;width=512/https%3A%2F%2Fazukiazusa.dev%2Fblog%2Fogp%2Fdefine-custom-properties-with-css-property-rule.png)