Rainbow background animation

by MahuaSarkar

HTML

<div class="rainbow ">
	<div>
	Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.
	</div>
</div>

CSS

.rainbow {
  background-image: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  animation: change 1s ease-in-out infinite;
  
}
@keyframes change {
  0% {
    background: linear-gradient(-45deg, #23d5ab, #ee7752, #e73c7e, #23a6d5);
  }
  50% {
    background: linear-gradient(-45deg, #23a6d5, #23d5ab, #ee7752, #e73c7e);
  }
  100% {
    background: linear-gradient(-45deg, #e73c7e, #23a6d5, #23d5ab, #ee7752);
  }
}