JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="100" height="100"></canvas><br />
<img id='image' src='' /><br />
<input type="submit" id="submit" value="Копировать из canvas в img" />

CSS

canvas,img{border: 1px solid #000;}

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
 
 ctx.fillStyle = "rgb(200,0,0)";
 ctx.fillRect (10, 10, 80, 80);

$("submit").onclick = function() {
    var canvasImageData = canvas.toDataURL("image/jpg");
    var image = document.getElementById("image");
    image.src = canvasImageData;
}