How to use utils.drawRect() to draw Rectangle with opaque color

[abdullahamin231]

I'm trying to draw an opaque rectangle much like what you can draw on the preview website, but with each second the color increases in opacity.
https://preview.klinecharts.com/#en-US
Here's the code if it helps:

useEffect(() => {
const chart = init(chartID);
thisChartRef.current = chart;
const drawRectangles = () => {
const canvas = thisChartRef.current.getDom().querySelector("canvas");
const ctx = canvas.getContext("2d");
rectangles.forEach((rectangle) => {
utils.drawRect(ctx, rectangle.rect, rectangle.styles);
});
};

let rectangles = [];
if (topChartRef) {
  rectangles = [
    {
      rect: { x: 0, y: 0, width: 100, height: 300 },
      styles: { : "rgba(32, 148, 243, 0.01)", style: "fill" },
    },
  ];
}

const intervalId = setInterval(() => {
    drawRectangles();
}, 1000);
return () => {
  dispose(chartID);
  clearInterval(intervalId);
};

}, []);

return (
<>

</>
);
}