@property --angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}

:root {
  --color1: #7bd389;
  --color2: #607466;
}


@keyframes gradient {
  0% {
    --angle: 0deg;
  }
  
  100% {
    --angle: 360deg;
  }
}

.gradient {
  width: 100px;
  height: 100px;
  background: linear-gradient(var(--angle), var(--color1), var(--color2));
  animation: gradient 3s linear infinite;
}