Движущиеся градиенты за 5 сек в Taplink

Пример работы: https://tap.one-way.dev/p/da0c0d/

Видеоинструкция:

Код в примере:

<style>
font[color="#dee2e6"] {
  animation: shine 5s linear infinite;
 background: linear-gradient(270deg, rgba(5, 204, 231, 0.87) 1.5%, rgba(237, 0, 0, 0.45) 24.65%, #19AF00 49.29%, rgba(237, 0, 0, 0.46) 75.86%, rgba(5, 204, 231, 0.87) 100%);
  background-size: 200% auto;
    background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

font[color="#fff4e6"] {
   animation: shine 5s linear infinite;
 background: linear-gradient(270deg, rgba(5, 204, 231, 0.87) 1.5%, rgba(237, 0, 0, 0.45) 24.65%, #19AF00 49.29%, rgba(237, 0, 0, 0.46) 75.86%, rgba(5, 204, 231, 0.87) 100%);
  background-size: 200% auto;
    background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@keyframes shine {
    to {
      background-position: 200% center;
    }
  }
</style>