JSFiddle - React, Tailwind, and code Playground

by helxsz

HTML

<canvas id="canvas" height="300" width="300">

JavaScript

$(function() {
    
    draw(document.getElementById('canvas').getContext('2d'));
    
    function draw(ctx) {
      

  var radgrad = ctx.createRadialGradient(60,60,0,60,60,60);
  radgrad.addColorStop(0, 'rgba(255,0,0,1)');
  radgrad.addColorStop(0.8, 'rgba(228,0,0,.9)');
  radgrad.addColorStop(1, 'rgba(228,0,0,0)');
  
  // draw shape
  ctx.fillStyle = radgrad;
  ctx.fillRect(0,0,150,150);

    }
    function setShadow(ctx, color, ox, oy, blur) {
      ctx.shadowColor = color;
      ctx.shadowOffsetX = ox;
      ctx.shadowOffsetY = oy;
      ctx.shadowBlur = blur;
    }
    
});