Анимация градиентного фона
HTML:
CSS:
👉 @FrontendPortal | #CSS
HTML:
<div class="animated-bg"></div>
CSS:
.animated-bg {
background: linear-gradient(
to right, #833ab4, #fd1d1d, #fcb045);
background-size: 400% 400%;
animation: animated-bg 10s infinite ease-in-out;
}
@keyframes animated-bg {
0% {
background-position: 0 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0 50%;
}
}
👉 @FrontendPortal | #CSS