JSFiddle - React, Tailwind, and code Playground

by shapeshifta

HTML

<canvas id="drawSurface" width="400px" height="400px" style="border: 1px dashed black;"></canvas>

JavaScript

var canvas = document.getElementById("drawSurface");
var context = canvas.getContext("2d");
context.fillStyle = "rgba(0, 0, 255, 0.5)";

canvas.addEventListener("mousemove", paint, false);

function paint(event) {
    context.fillRect(event.clientX, event.clientY, 10, 10);
}