Body background colors animation using html and CSS, animation world
Body Background Colors Animations code
- Html
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Animation Wolrd</title>
</head>
<body>
<div class="container"></div>
</body>
</html>
- Css
*{
margin: 0;
padding: 0;
box-sizing:border-box;
font-family: "poppins",sans-serif;
}
body
{
min-width: 100vh;
}
.container
{
height: 100vh;
width: 100%;
background: linear-gradient(45deg,#d2001a,#7462ff,
#f48e21,#23d5ab);
background-size: 300% 300%;
animation: color 12s ease-in-out infinite;
}
@keyframes color{
0%{
background-position: 0% 50%;
}
50%{
background-position: 100% 50%;
}
100%{
background-position: 0% 50%;
}
}
Just copy it on your project
And Don't forget to Subscribe To my youtube channel
channel link
