JSFiddle - React, Tailwind, and code Playground
CSS
body{ background: -webkit-canvas(bgCanvas); }
JavaScript
function renderBackground() {
var width = window.innerWidth,
height = window.innerHeight,
ctx = document.getCSSCanvasContext('2d', "bgCanvas", width, height),
img = new Image(),
radgrad = ctx.createRadialGradient(width / 2, -1 * height, 0, width / 2, -1 * height, width),
x, y;
radgrad.addColorStop(0, 'rgba(255,255,255,.3)');
radgrad.addColorStop(1, 'rgba(0,0,0,.3)');x, y;
ctx.fillStyle = radgrad;
ctx.fillRect(0, 0, width, height);
img.onload = function() {
for (x = 0; x < width; x += 200) {
for (y = 0; y < height; y += 200) {
ctx.drawImage(img, x+0.5, y+0.5);
}
}
}
img.src = "http://i44.tinypic.com/2igbqqv.png";
}
$(function(){
renderBackground();
})();