JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id=myCanvas widht=500 height=500>
    Hola, soy un contenido alternativo
</canvas>

JavaScript

// creamos una referencia para el elemento
var dibujo = document.getElementById('myCanvas');

// comprobamos el soporte del navegador
if(dibujo && dibujo.getContext) {
    // inicializamos el contexto 2D (sólo un contexto por elemento)
    var context = dibujo.getContext('2d');
    if (context) {
        //declaramos el color de relleno
        //context.fillStyle = 'silver';
        
        //dibujamos el rectángulo
        //context.fillRect(0, 0, 400, 250);
        
        //declaramos color de relleno y borde
        //context.strokeStyle = "#000000";
        //context.lineWidth = 3;
        //context.fillStyle = "#FFFF00";
        
        //dibujamos el círculo
        //context.arc(150,120,50,0,Math.PI*2,false);
        
        //rellenamos el círculo
        //context.stroke();
        //context.fill();
        
        //texto
        //context.fillStyle = 'black';
        //context.font = "bold 18px sans-serif";
        //context.fillText("Un círculo", 110, 210);
    }

}