@property --color {
  syntax: '<color>';
  inherits: false;
  initial-value: #ff0;
}

body {
  --color: #ff0;
  margin: 0;
  height: 100vh;
  overflow: hidden;
  background:
    repeating-linear-gradient(90deg, var(--color) 0 5vmin, #0000 0 10vmin),
    repeating-linear-gradient(-70deg, #0000 0 3vmin, #000 0 3.5vmin);
  transition: --color 1s;
}

body:hover {
  --color: #ff00;
}