<div>
</div>

@keyframes blink {
  0% {
    background: violet;
  }
  14.3% {
    background: indigo;
  }
  28.6% {
    background: blue;
  }
  42.9% {
    background: green;
  }
  57.2% {
    background: yellow;
  }
  71.5% {
    background: orange;
  }
  85.8% {
    background: red;
  }
  100% {
    background: violet;
  }
}

@-webkit-keyframes blink {
  0% {
    background: violet;
  }
  14.3% {
    background: indigo;
  }
  28.6% {
    background: blue;
  }
  42.9% {
    background: green;
  }
  57.2% {
    background: yellow;
  }
  71.5% {
    background: orange;
  }
  85.8% {
    background: red;
  }
  100% {
    background: violet;
  }
}

div {
  height: 300px;
  width: 300px;
  border: 1px solid black;
  animation: blink 20s linear infinite;
  -webkit-animation: blink 20s linear infinite;
}