Ninsoare 5

 <canvas id="canvas-ninsoare" style="position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; pointer-events:none;"></canvas>

<script>
//*Create by petre-vitan*//
(function() {
    const canvas = document.getElementById('canvas-ninsoare');
    const ctx = canvas.getContext('2d');
    
    let width, height, flakes = [];

    function init() {
        width = window.innerWidth;
        height = window.innerHeight;
        canvas.width = width;
        canvas.height = height;
        flakes = [];
        for (let i = 0; i < 150; i++) {
            flakes.push({
                x: Math.random() * width,
                y: Math.random() * height,
                r: Math.random() * 4 + 1,
                d: Math.random() * 1
            });
        }
    }

    function draw() {
        ctx.clearRect(0, 0, width, height);
        ctx.fillStyle = "rgba(255, 255, 255, 0.8)";
        ctx.beginPath();
        for (let i = 0; i < flakes.length; i++) {
            let f = flakes[i];
            ctx.moveTo(f.x, f.y);
            ctx.arc(f.x, f.y, f.r, 0, Math.PI * 2, true);
        }
        ctx.fill();
        update();
    }

    function update() {
        for (let i = 0; i < flakes.length; i++) {
            let f = flakes[i];
            f.y += Math.pow(f.d, 2) + 1;
            f.x += Math.sin(f.y / 50);
            if (f.y > height) {
                flakes[i] = { x: Math.random() * width, y: -10, r: f.r, d: f.d };
            }
        }
    }

    window.addEventListener('resize', init);
    init();
    setInterval(draw, 30);
})();
</script>