What is the CSS @property rule?

@property allows developers to explicitly define CSS custom properties, providing type checking, default values, and animation capabilities.

Normally, CSS variables are treated as strings. By registering a variable with @property, you tell the browser it is a color, a length, or a percentage. This suddenly makes custom variables animatable!