css transition animation gradient code example

Example 1: transition background gradient

In CSS, you can't transition a background gradient. It jumps from one gradient to the other immediately, with no smooth transition between the two. He documents a clever tactic of positioning a pseudo element covering the element with a different background and transitioning the opacity of that pseudo element.

Example 2: Css gradient animations

Here a codePen with cool animations:
https://codepen.io/DevLorenzo/pen/ExgpvJM