@property rule dùng để làm gì?

Rule @property cho phép đăng ký CSS custom property với kiểu dữ liệu cụ thể, giá trị mặc định và quy tắc kế thừa.

Ví dụ: @property --hue { syntax: '<angle>'; initial-value: 0deg; inherits: false; } khai báo biến --hue có kiểu là góc. Lợi ích lớn nhất là cho phép animate các custom properties — bình thường browser không biết cách interpolate custom properties nên không thể transition, nhưng với @property khai báo kiểu <color> hoặc <angle>, browser có thể animate mượt mà giữa các giá trị. Ứng dụng phổ biến nhất là animate gradient colors và tạo hiệu ứng chuyển màu phức tạp.