1. Tutorials
  2. CSS
  3. Background Color Animation

Background Color Animation

In this tutorial, you will learn how to add a background color animation with CSS. Watch the video below for a detailed tutorial.

CSS

body {
  animation: changeBgColor 30s infinite;
}

@keyframes  changeBgColor {
  0% {
    background-color: blue;
  }
  10% {
    background-color: green;
  }
  25% {
    background-color: yellow;
  }
  50% {
    background-color: red;
  }
  75% {
    background-color: purple;
  }
  50% {
    background-color: pink;
  }
}