JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<canvas id="divPad" style="height: 500px; width: 500px"></canvas>
JavaScript
var canvas = new fabric.Canvas('divPad', {
width: $("#divPad").width(),
height: $("#divPad").height()
});
var circle = new fabric.Circle({
radius: 150,
stroke: '#f55',
fill: "transparent",
top: 50,
left: 50
});
circle.selectable = false;
canvas.add(circle);
canvas.renderAll();
canvas.clipTo = function (ctx) {
circle.render(ctx);
};
var text = new fabric.Text("Testing", {
fontSize: 25
});
canvas.centerObject(text);
canvas.add(text);
canvas.renderAll();