JSFiddle - React, Tailwind, and code Playground

HTML

<img src='http://xmpps.greenmaw.com/~coda/html52d/hero.png' id='hero' style='display:none' />
<canvas width='1200' height='1200' />

JavaScript

var ctx = document.querySelector('canvas').getContext('2d');
ctx.imageSmoothingEnabled = false;
ctx.translate(99.5, 99.5);
ctx.scale(2, 2);
var img = document.querySelector('#hero');
ctx.drawImage(img, 32,   32,   16, 16, 0,  0, 16, 16);
ctx.drawImage(img, 31.5, 31.5, 16, 16, 16, 0, 16, 16);
ctx.setTransform(1,0,0,1,0,0)
ctx.drawImage(img, 0, 0,img.width * 4,img.height * 4);