Falling Snow

page decoration 1997 still works

Snowflakes drift down the page. Switched on every December from 1997 onward.

In 2026: Rewritten from the <layer> / document.all original to plain divs. Same effect, runs everywhere.

Where it came from: Altan of kurt.se wrote the most-copied version, 1997. Reprinted on Dynamic Drive and most other archives. Wikipedia ↗

<script language="JavaScript">
var FLAKES = 30, flakes = [];
for (var i = 0; i < FLAKES; i++) {
  var f = document.createElement("div");
  f.innerHTML = "\u2744";
  f.style.cssText = "position:fixed;top:-20px;pointer-events:none;z-index:9998;"
    + "color:#fff;text-shadow:0 0 3px #6cf";
  document.body.appendChild(f);
  flakes.push({
    el: f,
    x: Math.random() * window.innerWidth,
    y: Math.random() * window.innerHeight,
    s: 0.6 + Math.random() * 1.6,
    r: 0.4 + Math.random() * 1.2,
    a: Math.random() * 6.28
  });
  f.style.fontSize = (8 + Math.random() * 14) + "px";
}
setInterval(function () {
  for (var i = 0; i < flakes.length; i++) {
    var f = flakes[i];
    f.y += f.s;
    f.a += 0.03;
    if (f.y > window.innerHeight) { f.y = -20; f.x = Math.random() * window.innerWidth; }
    f.el.style.left = (f.x + Math.sin(f.a) * 18) + "px";
    f.el.style.top = f.y + "px";
  }
}, 33);
</script>

sandboxed demo · breaks nothing but itselfrestart

More in page decoration