div {
  margin: 50px auto;
  width: 150px;
  height: 150px;
  background: black;
  animation-name: color-change;
  animation-timing-function: ease-in-out;
  animation-duration: 2s;
  animation-delay: 1s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
}
@keyframes color-change {
    0% {
        background: black;
    }
    100% {
        background: red;
    }
}