CSS Background Color Animation

by ken tsai

CSS

body {
    background-color: red;
    animation: losbastardos 10s linear 0s infinite alternate; /* Firefox */
    -webkit-animation: losbastardos 10s linear 0s infinite alternate; /* Chrome, Safari, Opera */
}

@keyframes losbastardos {
    10% {background-color: pink;}
    20% {background-color: yellow;}
    30% {background-color: green;}
    40% {background-color: lightgray;}
    50% {background-color: blue;}
    60% {background-color: lightblue;}
    70% {background-color: black;}
    80% {background-color: gold;}
    90% {background-color: silver;}
    100% {background-color: red;}
}

@-webkit-keyframes losbastardos {
    10% {background-color: pink;}
    20% {background-color: yellow;}
    30% {background-color: green;}
    40% {background-color: lightgray;}
    50% {background-color: blue;}
    60% {background-color: lightblue;}
    70% {background-color: black;}
    80% {background-color: gold;}
    90% {background-color: silver;}
    100% {background-color: red;}
}