JSFiddle - React, Tailwind, and code Playground

by Steven Lambert

HTML

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

CSS

canvas {
  background: white;
}

JavaScript

var canvas = document.querySelector('canvas');
var context = canvas.getContext('2d');

var image = new Image();
image.onload = function() {
	context.drawImage(image, 1, 1, 30, 30, 9.4, 9, 32, 32);
}

image.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAtElEQVRYR+2XWw7AIAgE4f6Hpmkaa32hWBA/7AHccRqVRQAicPzwAUD0YSASAxABawwRBJsRAPSCc4NjIAMA0mAZSAfgb3iAadtgALTCeYgGgHZ4G6ICYBVeh9gNwHr3pYXMgCvAqvDUwsfAATgGjgF3A/f5XAURn+edbsJwQ1lbSIeT3V5DawvlaLbrSKZtYmoo1YLg+8FAL5gFUSsmedHoHdOx4LgtcTfULbHvL9BdVrLaBbs2z+GYw+/7AAAAAElFTkSuQmCC';