JSFiddle - React, Tailwind, and code Playground

by psycketom

JavaScript

var smileyCanvas, smileyElement;

smileyElement = document.createElement('canvas');
smileyElement.width = 400;
smileyElement.height = 400;
smileyElement.id = 'smiley';

document.body.appendChild(smileyElement);
    
smileyCanvas = smileyElement.getContext('2d');

var smiley = new Image();
smiley.src = 'http://images4.wikia.nocookie.net/__cb20080915185924/emoticon/images/1/16/Blue_smiley_face.png';
smiley.onload = function()
{    
    smileyCanvas.shadowColor = 'rgba(0, 0, 0, 0.5)';
    smileyCanvas.shadowOffsetX = -10;
    smileyCanvas.shadowOffsetY = -10;
    
    smileyCanvas.shadowBlur = 10;
    
    smileyCanvas.drawImage(this, 0, 0);
    
    smileyCanvas.fillStyle = 'red';
    smileyCanvas.fillRect(20, 20, 50, 50);
};