Calming and Peaceful Snowfall Effect Written in Pure JS/CSS

Snow falls (PureSnow.js) slowly on a winter’s night. Probably the most relaxing and calming snowfall effect written in pure JS/CSS.

Inspired by:  alphardex (SCSS Version) and YusukeNakaya (Vue implementation).

How to make use of it:

1. Load the PureSnow.js JavaScript within the doc.

<script src="./PureSnow.js"></script>

2. Create an empty DIV component that serves because of the container for the snowfall effect.

<div id="snow"></div>

3. Apply your individual styles to the snowflakes.

.snowflake {
  position: absolute;
  width: 10px;
  height: 10px;
  background: linear-gradient(white, white);
  border-radius: 50%;
  filter: drop-shadow(0 0 10px white);
}

4. Toggle the snowfall effect.

toggle_snow()

5. Specify the variety of snowflakes to generate.

let snowflakes_count = 300;

Animated Snowfall Effect, PureSnow.js Plugin/Github, how to add falling snow on your website, javascript falling animation, falling snow effect, create a snow effect using set interval in javascript, website snow effect


See Demo And Download

Official Website(hyperstown): Click Here

This superior jQuery/javascript plugin is developed by hyperstown. For extra Advanced Usage, please go to the official website.

Share