JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas1" width="400" height="400"></canvas>

CSS

canvas {
    border: 1px solid gray;
}

JavaScript

var can = document.getElementById('canvas1');
var ctx = can.getContext('2d');

var img = new Image();
img.onload = function() {
for (var x = 0.3; x < 200; x+=15) {
    for (var y = 0.3; y < 200; y+=15) {
        //ctx.drawImage(img, 0, 0, 15, 15, x, y, 15, 15);
        // If we merely use 16x16 tiles instead,
        // this will never happen:
        ctx.drawImage(img, 0, 0, 16, 16, x, y, 16, 16);
    }
}
}
img.src = "http://upload.wikimedia.org/wikipedia/en/thumb/0/06/Neptune.jpg/100px-Neptune.jpg";