Created
November 30, 2023 10:04
-
-
Save ronaldgreeff/14a0eea5d4462d3c40b8a6663d2fc8d7 to your computer and use it in GitHub Desktop.
Animated css background
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| background: linear-gradient(45deg, #16a596, #1f2d44, #e4566e); | |
| background-size: 600% 600%; | |
| height: 100%; | |
| -webkit-animation: animbackground 30s ease infinite; | |
| -moz-animation: animbackground 30s ease infinite; | |
| animation: animbackground 30s ease infinite; | |
| } | |
| @-webkit-keyframes animbackground { | |
| 0%{background-position:100% 0%} | |
| 50%{background-position:0% 100%} | |
| 100%{background-position:100% 0%} | |
| } | |
| @-moz-keyframes animbackground { | |
| 0%{background-position:100% 0%} | |
| 50%{background-position:0% 100%} | |
| 100%{background-position:100% 0%} | |
| } | |
| @keyframes animbackground { | |
| 0%{background-position:100% 0%} | |
| 50%{background-position:0% 100%} | |
| 100%{background-position:100% 0%} | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment