Summary: The animation-composition property defines the composite operation used when multiple animations affect the same property simultaneously. We support the similar feature in Web Animations (for script-generated animations) already, and this new CSS property is for CSS Animations. The values of animation-composition have the meaning defined for the
corresponding values of the composite operation defined in Web
Animations. There is an example in the spec link if you are interested.
Specification: https://drafts.csswg.org/css-animations-2/#animation-composition
Platform coverage: all
Preference: "layout.css.animation-composition.enabled"
DevTools bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1778407
Other browsers:
1) Blink: doesn't support it.
2) Webkit: supports this already since January, 2022. (https://bugs.webkit.org/show_bug.cgi?id=232086) but has not shipped yet.
web-platform-tests: The wpt has been merged since https://bugzilla.mozilla.org/show_bug.cgi?id=1748435, in
css/css-animations/ folder.
Thanks,
Boris