Анимация снежинок на CSS

Анимация снежинок на CSS

Анимация снежинок прекрасно подойдет в новогоднее время, такой анимацией можно украсить как весь сайт, так и отдельные его элементы. Фон и снежинки можно заменить на такие, которые подойдут для вашего дизайна.

Пример

HTML


<div class="animation-bg">
  <div class="bg-ex-snowflake"></div>
</div>

CSS


.animation-bg{
  display: flex;
  justify-content: center;
  align-items: center;
  background: #042548;
  height: 350px;
}
.bg-ex-snowflake {
  background: url('image.png'); /* Путь к картинке */
  background-position: 0 0;
  background-repeat: repeat;
  animation: animated-snowflake 60s linear infinite;
  width: 100%;
  height: 350px;
}
@keyframes animated-snowflake {
  from { background-position: -800px 0; }
  to { background-position: 0 800px; }
}
By julia