KeyframeEffect: composite property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2022.

The composite property of a KeyframeEffect resolves how an element's animation impacts its underlying property values.

Value

To understand these values, take the example of a keyframeEffect value of blur(2) working on an underlying property value of blur(3).

replace: The keyframeEffect overrides the underlying value it is combined with: blur(2) replaces blur(3).
add: The keyframeEffect is added to the underlying value with which it is combined (aka additive): blur(2) blur(3).
accumulate: The keyframeEffect is accumulated on to the underlying value: blur(5).

Specification
Web Animations # dom-keyframeeffect-composite

	desktop					mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Internet	WebView Android	WebView on iOS
`composite`	Chrome – Full support Chrome 84 (Release date: 2020-07-27) footnote Full support	Edge – Full support Edge 84 (Release date: 2020-07-16) footnote Full support	Firefox – Full support Firefox 80 (Release date: 2020-08-25) footnote Full support	Opera – Full support Opera 71 (Release date: 2020-09-15) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Chrome Android – Full support Chrome Android 84 (Release date: 2020-07-27) footnote Full support	Firefox for Android – Full support Firefox for Android 80 (Release date: 2020-08-31) footnote Full support	Opera Android – Full support Opera Android 60 (Release date: 2020-09-23) footnote Full support	Safari on iOS – Full support Safari on iOS 16 (Release date: 2022-09-12) footnote Full support	Samsung Internet – Full support Samsung Internet 14 (Release date: 2021-04-17) footnote Full support	WebView Android – Full support WebView Android 84 (Release date: 2020-07-27) footnote Full support	WebView on iOS – Full support WebView on iOS 16 (Release date: 2022-09-12) footnote Full support

Tip: you can click/tap on a cell for more information.