← Go back
Day 6
⸻
Let it snow
By
A classic winter demo for you today, enjoy! ❄️
Powered by the fantastic canvas-confetti
library.
This is the code that makes the snow on the page:
import confetti from 'canvas-confetti'
let skew = 1
frame()
function randomInRange(min, max) {
return Math.random() * (max - min) + min
}
function frame() {
skew = Math.max(0.8, skew - 0.001)
confetti({
particleCount: 1,
startVelocity: 0,
origin: {
x: Math.random(),
// since particles fall down, skew start toward the top
y: Math.random() * skew - 0.2,
},
colors: ['#ffffff'],
shapes: ['circle'],
gravity: randomInRange(0.4, 0.6),
scalar: randomInRange(0.4, 1),
drift: randomInRange(-0.4, 0.4),
})
requestAnimationFrame(frame)
}
Happy holidays!