JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/fabric@5.3.0/dist/fabric.min.js"></script>
<!DOCTYPE html>
<html>

  <head>
    <title>Fabric.js Example</title>
    <style>
      canvas {
        border: 1px solid black;
      }

    </style>
  </head>

  <body>
    <canvas id="canvas" width="800" height="600"></canvas>

    <script>
      // Initialize the Fabric.js canvas
      var canvas = new fabric.Canvas('canvas');

      // Create a rectangle
      var rect = new fabric.Rect({
        left: 100,
        top: 100,
        fill: 'red',
        width: 60,
        height: 70
      });

      // Create a text object
      var text = new fabric.Text('Hello Fabric.js', {
        left: 10,
        top: 10,
        fill: 'black'
      });

      // Add the rectangle and text to the canvas
      canvas.add(rect);
      canvas.add(text);
      canvas.on('before:render', ({
        ctx
      }) => {
        ctx.filter = 'blur(5px)'
      })

    </script>
  </body>

</html>