Animated Gradient Color Background HTML and Css

Demo Check

HTML

<div class="animated-gradient-background"></div>

CSS

<style>

.animated-gradient-background {

  width: 100%;

  height: 100vh;

  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);

  background-size: 400% 400%;

  animation: gradient-animation 15s ease infinite;

}

@keyframes gradient-animation {

  0% {

    background-position: 0% 50%;

  }

  50% {

    background-position: 100% 50%;

  }

  100% {

    background-position: 0% 50%;

  }

}

</style>