JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id='a' width='64' height='64'></canvas>
<canvas id='b' width='64' height='64'></canvas>
CSS
canvas, img {
image-rendering: optimizeSpeed;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-optimize-contrast;
image-rendering: optimize-contrast;
-ms-interpolation-mode: nearest-neighbor;
border: 5px solid #ddd;
}
canvas#b { width: 256px; height: 256px; } /* 4 * 64 = 256 */
JavaScript
var img = new Image();
img.src = 'http://upload.wikimedia.org/wikipedia/commons/f/f0/Pixelart-tv-iso.png';
img.onload = function () {
$('canvas').each(function () {
var ctx = this.getContext("2d");
ctx.drawImage(img, 0, 0);
});
};