CSS Gradient Animation
| .css-selector { | |
| background: linear-gradient(276deg, #ff0000, #fff500, #18ff00, #00ffbb, #0022ff, #f600ff, #ff0071); | |
| background-size: 1400% 1400%; | |
| -webkit-animation: AnimationName 14s ease infinite; | |
| -moz-animation: AnimationName 14s ease infinite; | |
| -o-animation: AnimationName 14s ease infinite; | |
| animation: AnimationName 14s ease infinite; | |
| } | |
| @-webkit-keyframes AnimationName { | |
| 0%{background-position:0% 44%} | |
| 50%{background-position:100% 57%} | |
| 100%{background-position:0% 44%} | |
| } | |
| @-moz-keyframes AnimationName { | |
| 0%{background-position:0% 44%} | |
| 50%{background-position:100% 57%} | |
| 100%{background-position:0% 44%} | |
| } | |
| @-o-keyframes AnimationName { | |
| 0%{background-position:0% 44%} | |
| 50%{background-position:100% 57%} | |
| 100%{background-position:0% 44%} | |
| } | |
| @keyframes AnimationName { | |
| 0%{background-position:0% 44%} | |
| 50%{background-position:100% 57%} | |
| 100%{background-position:0% 44%} | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment