The interpolate-size property allows for smooth transitions between CSS intrinsic sizes and numeric lengths, making it possible to animate properties like width and height more naturally.
By default, the interpolate-size property has a numeric-only setting, preventing smooth animations to intrinsic sizing keywords such as max-content and min-content.
Setting the interpolate-size property to allow-keywords enables interpolation from lengths to intrinsic sizes, allowing developers to create smoother, more visually appealing animations.
It's important to note that interpolation only works between a numeric value and an intrinsic sizing keyword; two intrinsic size keywords cannot be interpolated against each other.
Collection
[
|
...
]