JSFiddle - React, Tailwind, and code Playground

HTML

<div id="foo"></div>

CSS

#foo {
  width: 500px;
  height: 300px;
  background: url(https://vgy.me/41DlWV.png);
  background-size: cover;
  position: relative;
}

#foo:after {
  content: '';
  background: url(https://vgy.me/EnCHsR.png);
  background-size: cover;
  width: 100%; height: 100%;
  position: absolute;
  animation: fadeBg 3s ease 0s infinite alternate;
} 

@keyframes fadeBg {
  0%, 20% { opacity: 1; }
  100% { opacity: 0; }
}