Html animated background

Animated background css

/*
	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 vote129 views2 answers
How to set the width and heigth of the canvas to be the same size as that of an image
Html
44 votes101 views6 answers
Comment in html
Html
0 vote117 views1 answer
Nunjucks variables
Html
0 vote115 views1 answer
Ajust aos
Html
-1 vote127 views1 answer
Paragraph
Html
14 votes127 views3 answers
How to insert a line in html
Html
0 vote108 views1 answer
Tailwind CSS tabs
Html
1 vote152 views1 answer
Url encoded header
Html
3 votes121 views6 answers
Https://www.codegrepper.com
Html
0 vote126 views1 answer
Yaml multiline string
Html