bloqhead
12/23/2014 - 6:09 PM

CSS Gradient Animation

CSS Gradient Animation

background: linear-gradient(143deg, #244f66, #666124, #21f211, #af8ce1, #ff00d3, #003dfb, #af8ce1, #a7e18c, #dfe18c, #d02f35);
background-size: 2000% 2000%;
-webkit-animation: AnimationName 1s ease infinite;
-moz-animation: AnimationName 1s ease infinite;
-o-animation: AnimationName 1s ease infinite;
animation: AnimationName 1s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:0% 66%}
    50%{background-position:100% 35%}
    100%{background-position:0% 66%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 66%}
    50%{background-position:100% 35%}
    100%{background-position:0% 66%}
}
@-o-keyframes AnimationName {
    0%{background-position:0% 66%}
    50%{background-position:100% 35%}
    100%{background-position:0% 66%}
}
@keyframes AnimationName {
    0%{background-position:0% 66%}
    50%{background-position:100% 35%}
    100%{background-position:0% 66%}
}