New Want: I want gradients to be animatable

[samhenrigold]

My proposal:

---

title: I want linear and radial gradients able to be animated with CSS.
date: 2021-07-22
submitter: Sam Henri-Gold
number: FOR INTERNAL USE ONLY
tags: css, linear-gradient, radial-gradient, gradient, background-image, background, transition, animation

To animate a gradient today, there are a few hacky methods I've found:

1. Make a huge gradient (background-size: 400%, 400%) and animate the background position
2. Use an absolute-positioned pseudo element with a gradient and change it's opacity
3. Have elementX with a solid background, use an absolute-positioned pseudo element with a gradient that goes from rgb(111, 222, 233) to transparent, change elementX's background.

Allowing gradient stops to be animated directly would be a huge quality of life improvement and enable far more advanced designs to rival those on native platforms.

[samhenrigold]

This has been brought up many, many times on the CSSWG drafts repo but hasn't seem to have gotten anywhere.
#5617, #1332, #3783, #4999