Skip to content

Instantly share code, notes, and snippets.

@GradientAnimator

GradientAnimator/AnimationName-1587894659027-506.css

Created April 26, 2020 09:51
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save GradientAnimator/ab8ebefc601c5e7216bbe006d57b9553 to your computer and use it in GitHub Desktop.
Save GradientAnimator/ab8ebefc601c5e7216bbe006d57b9553 to your computer and use it in GitHub Desktop.
Download ZIP
CSS Gradient Animation
Raw
AnimationName-1587894659027-506.css
background: linear-gradient(342deg, #d50000, #c51162, #aa00ff, #00b8d4, #00c853, #aeea00, #ffd600, #ffab00, #ff6d00, #dd2c00);
background-size: 2000% 2000%;
-webkit-animation: AnimationName 22s ease infinite;
-moz-animation: AnimationName 22s ease infinite;
-o-animation: AnimationName 22s ease infinite;
animation: AnimationName 22s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:7% 0%}
    50%{background-position:94% 100%}
    100%{background-position:7% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:7% 0%}
    50%{background-position:94% 100%}
    100%{background-position:7% 0%}
}
@-o-keyframes AnimationName {
    0%{background-position:7% 0%}
    50%{background-position:94% 100%}
    100%{background-position:7% 0%}
}
@keyframes AnimationName {
    0%{background-position:7% 0%}
    50%{background-position:94% 100%}
    100%{background-position:7% 0%}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment