JSFiddle - React, Tailwind, and code Playground

HTML

<img id="map" src="https://i.picsum.photos/id/1039/6945/4635.jpg?hmac=tdgHDygif2JPCTFMM7KcuOAbwEU11aucKJ8eWcGD9_Q" alt="">

CSS

#map {
  animation: pulse 2s infinite;
  width: 90vw;
}
#map:hover {
  animation-play-state: paused;
  animation: step-end;
}

@keyframes pulse {
  0% {
    opacity: 1;
  }
  
  20% {
    opacity: 0.2;
  }

  60% {
    opacity: 0.2;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}