SOURCE

var c = document.getElementById('canv'),
$ = c.getContext("2d");
var w = c.width = window.innerWidth,
h = c.height = window.innerHeight;

Snowy();
function Snowy() {
  var snow, arr = [];
  var num = 600,
  tsc = 1,
  sp = 1;
  var sc = 1.3,
  t = 0,
  mv = 20,
  min = 1;
  for (var i = 0; i < num; ++i) {
    snow = new Flake();
    snow.y = Math.random() * (h + 50);
    snow.x = Math.random() * w;
    snow.t = Math.random() * (Math.PI * 2);
    snow.sz = (100 / (10 + (Math.random() * 100))) * sc;
    snow.sp = (Math.pow(snow.sz * .8, 2) * .15) * sp;
    snow.sp = snow.sp < min ? min: snow.sp;
    arr.push(snow);
  }
  go();
  function go() {
    window.requestAnimationFrame(go);
    $.clearRect(0, 0, w, h);
    $.fillStyle = 'hsla(242, 95%, 3%, 1)';
    $.fillRect(0, 0, w, h);
    $.fill();
    for (var i = 0; i < arr.length; ++i) {
      f = arr[i];
      f.t += .05;
      f.t = f.t >= Math.PI * 2 ? 0 : f.t;
      f.y += f.sp;
      f.x += Math.sin(f.t * tsc) * (f.sz * .3);
      if (f.y > h + 50) f.y = -10 - Math.random() * mv;
      if (f.x > w + mv) f.x = -mv;
      if (f.x < -mv) f.x = w + mv;
      f.draw();
    }
  }
  function Flake() {
    this.draw = function() {
      this.g = $.createRadialGradient(this.x, this.y, 0, this.x, this.y, this.sz);
      this.g.addColorStop(0, 'hsla(255,255%,255%,1)');
      this.g.addColorStop(1, 'hsla(255,255%,255%,0)');
      $.moveTo(this.x, this.y);
      $.fillStyle = this.g;
      $.beginPath();
      $.arc(this.x, this.y, this.sz, 0, Math.PI * 2, true);
      $.fill();
    }
  }
}
/*________________________________________*/
window.addEventListener('resize',
function() {
  c.width = w = window.innerWidth;
  c.height = h = window.innerHeight;
},
false);

<canvas id='canv'>
</canvas>
<h2>
  Midnight Snow
</h2>

@import url(https://fonts.googleapis.com/css?family=Molle:400italic&subset=latin,latin-ext);
body {
  background-color: hsla(0, 0%, 0%, 1);
  margin: 0px;
  overflow: hidden;
  font-family: 'Molle', cursive;
}

h2 {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate( -50%, -50%);
  font-size: 3em;
  color: hsla(255, 255%, 255%, .1);
}