JSFiddle - React, Tailwind, and code Playground

by Sebastian Kay

HTML

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

  <img id="img" src="test.gif" style="position:absolute; top:500px"/>

JavaScript

var canvas, ctx;

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

	var a=40;
  var size=500;
	ctx.fillStyle = '#eee';
	ctx.fillRect(0, 0, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(40, 0, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(80, 0, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(120, 0, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(160, 0, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(200, 0, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(240, 0, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(280, 0, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(320, 0, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(360, 0, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(400, 0, a, a);
	
	ctx.fillStyle = '#fff';
	ctx.fillRect(0, 40, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(40, 40, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(80, 40, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(120, 40, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(160, 40, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(200, 40, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(240, 40, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(280, 40, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(320, 40, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(360, 40, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(400, 40, a, a);

	ctx.fillStyle = '#eee';
	ctx.fillRect(0, 80, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(40, 80, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(80, 80, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(120, 80, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(160, 80, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(200, 80, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(240, 80, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(280, 80, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(320, 80, a, a);
	ctx.fillStyle = '#fff';
	ctx.fillRect(360, 80, a, a);
	ctx.fillStyle = '#eee';
	ctx.fillRect(400, 80, a, a);
	
	ctx.fillStyle = '#fff';
	ctx.fillRect(0, 120, a, a);
	ctx.fillStyle =...