JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

cv = document.getElementById("test");
ctx = cv.getContext("2d");


var im = new Image();
im.onload = function () {
    
    ctx.beginPath();
    ctx.arc(110, 110, 100, 0, 2*Math.PI, true);
    ctx.clip();
    
    ctx.drawImage(im, 0, 0);

}
im.src = "http://placekitten.com/300/300";