JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="drawing"></canvas>
<div id="eh">Trollolo lo hej</div>

CSS

#drawing {
    position: fixed;
    top: 0;
    z-index: -1;
}
#eh {
    z-index: 5;
    width: 200px;
    height: 200px;
    margin: 200px auto 0 auto;
    background: white;
}

JavaScript

var canvas = document.getElementById("drawing");
context = canvas.getContext("2d");

// p.size(400, 400);
canvas.width = 600;
canvas.height = 600;

// p.background(0, 0, 0);
context.fillStyle = "black";
context.fillRect(0, 0, canvas.width, canvas.height);

var collection = [];
for (var i = 0; i < 200; i++) {
    // Make a star object
    var star = {};
    star.x = Math.random() * canvas.width;
    star.y = Math.random() * canvas.height;
    star.sx = Math.random() - 0.5;
    star.sy = Math.random() - 0.5;
    star.size = 5 + Math.random() * 20;
    // Add the star object to the collection
    collection.push(star);
}

// Set up the draw function
var draw = function () {
    context.fillStyle = "black";
    context.clearRect(0, 0, canvas.width, canvas.height);
    //context.fillRect(0, 0, canvas.width, canvas.height);

    var cw = canvas.width;
    var ch = canvas.height;
    var grad = context.createLinearGradient(0, ch, cw, 0);
    grad.addColorStop(0, 'hsla(0,100%,50%,0.5)');

    grad.addColorStop(1 / 6, 'hsla(60,100%,50%,0.5)');

    grad.addColorStop(2 / 6, 'hsla(120,100%,50%,0.5)');

    grad.addColorStop(3 / 6, 'hsla(180,100%,50%,0.5)')

    grad.addColorStop(4 / 6, 'hsla(240,100%,50%,0.5)');

    grad.addColorStop(5 / 6, 'hsla(300,100%,50%,0.5)');

    grad.addColorStop(1, 'hsla(360,100%,50%,0.5)');
    context.fillStyle = grad;
    for (i = 0; i < collection.length; i++) {
        var star = collection[i];
        context.beginPath();
        context.arc(star.x, star.y, star.size, 0, Math.PI * 2, true);
        context.closePath();
        context.fill();
        star.x += star.sx;
        star.y += star.sy;
        if (star.x >= cw + 50 || star.x < -50 || star.y >= ch + 50 || star.y < -50) {
            star.x = cw / 2;
            star.y = ch / 2;
        }
        // How can we make the stars move?
    }

};

// Loop the draw function
setInterval(draw, 100);