#el {
  --color-stop: deeppink;
  background: linear-gradient(white, var(--color-stop))
  transition: --color-stop 1s;
}
#el:hover {
  --color-stop: deepskyblue;
}
CSS.registerProperty({
  name: '--color-stop',
  syntax: '<color>',
  inherits: false,
  initialValue: 'transparent'
})