JSFiddle - React, Tailwind, and code Playground

by dchudz

HTML

<canvas id="canvas" width="1000" height="1000"></canvas>

JavaScript

function draw() {
  var stepValue = 42.5;
  var numRows = 500;
  var numCols = 500;

  var ctx = document.getElementById('canvas').getContext('2d');

  for (var i=0; i<numRows; i++){
    for (var j=0; j<numCols; j++){

      //set the fill style for each rectangle drawn
      //the rgb() function only takes integers
      //use Math.floor to return whole numbers
      ctx.fillStyle = "#5DF4B6";
      ctx.fillRect( j*2.5, i*2.5, 2.5, 2.5);
    }
  }
}

draw();