JSFiddle - React, Tailwind, and code Playground

by Steve Eberhardt

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.3.4/fabric.js"></script>
<canvas id="c" width="400" height="400"></canvas>

CSS

canvas {
    border: 1px solid #999;
}
img {
    display: none;
}
.canvas-container {
    margin-bottom: 10px;
}

JavaScript

var canvas = window._canvas = new fabric.Canvas('c');


fabric.Object.prototype.objectCaching = false;

var TextObj = new fabric.Text('Text Text',{
  left: 100,
  top: 100,
  fill: "#770faf",
  width: 170,
  height: 100,
  underline: false
});

TextObj.setShadow({
        color: 'rgba(0,0,0,0.7)',
        blur: 10,
        offsetX: 10,
        offsetY: 10
      });

canvas.add(TextObj);

canvas.renderAll();