JSFiddle - React, Tailwind, and code Playground

by ghostoy

HTML

<canvas id="mycanvas"></canvas>

<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function(){
        var canvas=document.getElementById("mycanvas");
        canvas.width = 800;
        canvas.height = 800;
        var ctx=canvas.getContext("2d");
        
        var grad=ctx.createLinearGradient(0,0,100,0);
        grad.addColorStop(0, "#ffffff");
        grad.addColorStop(0.3,"#ff0000");
        grad.addColorStop(0.5,"#00ff00");
        grad.addColorStop(1, "#000000");
        ctx.fillStyle=grad;
        ctx.fillRect(0,0,100,100);
    });
</script>