Css animated background

/*
	use @keyframes and the animation property
	see this code running here: https://codepen.io/hylobates-lar/pen/qBbQeON
*/
html, body {
  width: 100%;
  height:100%;
}

body {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

Html animated background

    <video id="video" autoplay="true" loop muted>
      <source src="background.mp4" type="video/mp4"/>
    </video>

Similar codes

0 vote338 views1 answer
How to package tailwindcss for deployment
CSS
0 vote348 views1 answer
How to give opacity to background only
CSS
29 votes349 views4 answers
How to remove bullet in css
CSS
99 votes331 views2 answers
Css absolute in absolute
CSS
36 votes363 views6 answers
Gradient text
CSS
1 vote336 views1 answer
Materialize button
CSS
0 vote345 views1 answer
How to add color in css
CSS
28 votes352 views3 answers
Display sm none
CSS
0 vote672 views1 answer
Fgg
CSS
4 votes399 views1 answer
Move button in CSS
CSS