CSS Background Color Animation

CSS Background Color Animation (div)

HTML
<div class="full-back"></div>
CSS
html,
body{
  height: 100%;
  margin: 0;
}

.full-back{
   width: 100%;
   height: 100%;
   animation: animate 5s infinite;
}

@keyframes animate{
  0% {background-color: red;}
  25% {background-color: yelow;}
  50% {background-color: green;}
  75% {background-color: orange;}
  100% {background-color: blue;}
}

CSS Background Color Animation (body)

body {
   animation: backgroundChange 5s;
}

  @keyframes backgroundChange 
 {
    0%   {background: red;}
    25%  {background: yellow;}
    50%  {background: blue;}
    75%  {background: green;}
    100% {background: red;}
 }
609 Views
88190cookie-checkCSS Background Color Animation

Leave a Reply

Your email address will not be published. Required fields are marked *