JSFiddle - React, Tailwind, and code Playground

by btipling

HTML

<table id="background">
</table>

CSS

body {
  padding: 0;
  margin: 0;
}
table {
  padding: 0;
  margin: 0;
  border-width: 0;
  border-spacing: 0;
}
tr {
  padding: 0;
  margin: 0;
  border-width: 0;
}
td {
  padding: 0;
  margin: 0;
  border: 2px solid #111;
  border-top: 0px;
  border-left: 0px;
  width: 4px;
  height: 5px;
}

JavaScript

var numrows = 64;
 var numcols = 64;

function setup() {
   var t,
     tr,
     td,
     i,
     j;
    
    t = document.getElementById("background");
    
    for (i = 0; i < numrows; i++) {
      tr = document.createElement("tr");
      t.appendChild(tr);
      for (j = 0; j < numcols; j++) {
        td = document.createElement("td");
        setColor(td);
        tr.appendChild(td);
      }
    }
}

function setColor(td) {
    var green, redblue,
      min = 10,
      max = 110,
      greenmin = 1,
      greenmax = 60,
      isBright = .025;
    green = rand(greenmax, greenmin);
    redblue = rand(max, min);
    if (Math.random() <= isBright) {
        green = makeBright(green);
        redblue = makeBright(redblue);
    }
    td.style.backgroundColor = getColor(redblue, green, redblue);
}

function makeBright(c) {
    c += 100;
    if (c > 256) {
        return 256;
    }
    return c;
}

function getColor(r, g, b) {
    return "rgb(" + r + ", " + g + ", " + b + ")";
}

function run() {
    var rowNum, colNum, tr, td;
    rowNum = rand(0, numrows);
    colNum = rand(0, numcols);
    t = document.getElementById("background");
    tr = t.children[rowNum];
    td = tr.children[colNum];
    setColor(td);
    setTimeout(run, 10);
}

function rand(max, min) {
    return Math.floor((Math.random() * (max - min)) + min);
}
setup();
run();