Yo ninjas, in this JavaScript tutorial, I’ll show you how to make a snowy background effect using the HTML5 canvas element and some JavaScript. The canvas element can be used to make some cool drawings and animations via the JavaScript API, and is pretty simple when you get the hang of it!


========== JavaScript for Beginners Playlist ==========

========== CSS for Beginners Playlist ==========

========== HTML for Beginners Playlist ==========

========== The Net Ninja ============

For more front-end development tutorials & to black-belt your coding skills, head over to – or

========== Social Links ==========

Twitter – @TheNetNinja –


  1. Very nice 🙂 only problem is that the flakes are moving together so sometimes the right/left border of the canvy is empty

  2. OMG!!!!! You r a genious………. mannnnnnnn…………. i m now learning Javascript and by seing this made me to learn even better….. thank you………

  3. Hey!
    I'm trying to have a canvas like this as the background of my website.
    Is it possible to have text or html elements on top of a javascript canvas like this?
    I'm having trouble figuring out how to properly make a background with javascript.

  4. You are awesome. Thank you for sharing.Please, please continue this project. More than anyone else, I am keen to check all updates.

  5. i made this sort of thing couple years ago and wanted to have it so it only rendered the snow between december to end of january so i didnt have to add / remove code every year but that didnt work as expected and snowed every month strange really but if you know how to do that, i would like to see that addon as im lazy and dont want to add / remove code every year. ps i used js to detect the months so it should of worked but didnt and no idea why, any ideas?


Please enter your comment!
Please enter your name here