Collection of free HTML and pure CSS snow code examples from Codepen, GitHub and other resources. Update of April 2021 collection. 5 new items.

Author

  • Calle

Made with

  • HTML / CSS

About a code

Snow

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Alvaro Montoro

Made with

  • HTML (Pug) / CSS (SCSS)

About a code

Snowfall Animation

Snowfall animation in HTML and CSS (using Pug and SCSS respectively for simplicity).

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Demo image: CSS Paper Snowflakes

Author

  • Michelle Barker

Made with

  • HTML / CSS (SCSS)

About a code

CSS Paper Snowflakes

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • @BrawadaCom

Made with

  • HTML (Haml) / CSS (Sass)

About a code

Snow SVG Animate

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Aybüke Ceylan

Made with

  • HTML (Pug) / CSS (SCSS)

About a code

Snowy Day - Pure CSS Animation

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • alphardex

Made with

  • HTML / CSS (SCSS)

About a code

Snow

Pure CSS snow.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Red Stapler

Made with

  • HTML / CSS (SCSS)

About a code

Pure CSS Snow

Pure CSS snow fall effect.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Scott Kellum

Made with

  • HTML / CSS (SCSS)

About a code

Let it <marquee>snow</marquee>

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Lavi Perchik

Made with

  • HTML / CSS (SCSS)

About a code

CSS Snow

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Kyoya Baba

Made with

  • HTML (Pug) / CSS (SCSS)

About a code

HTML and CSS Snow Falling

Snows with HTML and random animations with SCSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • codeconvey

Made with

  • HTML / CSS

About a code

CSS Snow Animation Effect

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Irem Lopsum

Made with

  • HTML / CSS (SCSS)

About a code

Snowfall

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Kyle McCormick

Made with

  • HTML (Haml) / CSS (Sass)

About a code

CSS Snow Cloud

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Jason Hibbs

Made with

  • HTML (Markdown) / CSS (Less)

About a code

Let it Snow

Here we’re animating two backgrounds of highly compressed images at slightly different speed to create the illusion of depth (otherwise known as a parallax effect), and illustrate a gentle snowfall.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Keith Clark

Made with

  • HTML / CSS (SCSS) / JS

About a code

One Element CSS Snow

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Emmanuel Pilande

Made with

  • HTML (Pug) / CSS (SCSS)

About a code

Pure CSS Snow

Happy Holidays!

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Raphael

Made with

  • HTML (Haml) / CSS (SCSS)

About a code

Winter Is Coming

Pure CSS snow.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -