<div id="page">
  <div id="snow">
  <a href="#">Lorem ipsum</a>
  </div>
</div>
@-webkit-keyframes snow {
    0% { background-position: 0px 0px, 0px 0px, 0px 0px }
    50% { background-color: #b4cfe0 }
    100% {
        background-position: 500px 1000px, 400px 400px, 300px 300px;
        background-color: #6b92b9;
    }
}
@-moz-keyframes snow {
    0% { background-position: 0px 0px, 0px 0px, 0px 0px }
    50% { background-color: #b4cfe0 }
    100% {
        background-position: 500px 1000px, 400px 400px, 300px 300px;
        background-color: #6b92b9;
    }
}
@-ms-keyframes snow {
    0% { background-position: 0px 0px, 0px 0px, 0px 0px }
    50% { background-color: #b4cfe0 }
    100% {
        background-position: 500px 1000px, 400px 400px, 300px 300px;
        background-color: #6b92b9;
    }
}
@keyframes snow {
    0% { background-position: 0px 0px, 0px 0px, 0px 0px }
    50% { background-color: #b4cfe0 }
    100% {
        background-position: 500px 1000px, 400px 400px, 300px 300px;
        background-color: #6b92b9;
    }
}
#snow {
    background-color: #6b92b9;
    background-image: url('https://i.imgur.com/BiSmXaq.png'), url('https://i.imgur.com/XHuy0NJ.png'), url('https://i.imgur.com/okpRxJU.png');
    -webkit-animation: snow 20s linear infinite;
    -moz-animation: snow 20s linear infinite;
    -ms-animation: snow 20s linear infinite;
    animation: snow 20s linear infinite;
  position: absolute; height: 100vh; width: 100%
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.