diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceLeft.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceLeft.ts
index a09322dc2..debc47abe 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceLeft.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceLeft.ts
@@ -40,26 +40,26 @@ export const curlyBraceLeft = async (parent: SVGAElement, node: Node) => {
   const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));
   const paddingX = node.look === 'neo' ? (node.padding ?? 0) * 2 : (node.padding ?? 0);
   const paddingY = node.look === 'neo' ? (node.padding ?? 0) * 1 : (node.padding ?? 0);
-
   if (node.width || node.height) {
-    node.width = (node?.width ?? 0) - paddingX * 2;
-    if (node.width < 50) {
-      node.width = 50;
+    let radius = 5;
+    const cal_height = (((node?.height ?? 0) - paddingY * 2) * 10) / 11;
+    if (cal_height / 10 > 5) {
+      radius = cal_height / 10;
     }
 
-    // Adjustments for circular arc
-    const radiusAdjustment = Math.max(5, (node.height ?? 0) * 0.16667);
-
-    node.height = (node?.height ?? 0) - paddingY * 2 - radiusAdjustment;
-    if (node.height < 50) {
-      node.height = 50;
+    node.height = (node?.height ?? 0) - paddingY * 2 - 2 * radius;
+    if (node.height < 10) {
+      node.height = 10;
+    }
+    node.width = (node?.width ?? 0) - paddingX * 2 - 2 * radius;
+    if (node.width < 10) {
+      node.width = 10;
     }
   }
 
-  const w = Math.max(bbox.width, node.width ?? 0) + (paddingX ?? 0) * 2;
-  const h = Math.max(bbox.height, node.height ?? 0) + (paddingY ?? 0) * 2;
+  const w = (node.width ? node.width : bbox.width) + (paddingX ?? 0) * 2;
+  const h = (node.height ? node.height : bbox.height) + (paddingY ?? 0) * 2;
   const radius = Math.max(5, h * 0.1);
-
   const { cssStyles } = node;
 
   const points = [
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceRight.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceRight.ts
index 0a597c4db..b2be94398 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceRight.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraceRight.ts
@@ -42,22 +42,25 @@ export const curlyBraceRight = async (parent: SVGAElement, node: Node) => {
   const labelPaddingY = node.look === 'neo' ? (node.padding ?? 0) * 1 : (node.padding ?? 0);
 
   if (node.width || node.height) {
-    node.width = (node?.width ?? 0) - labelPaddingX * 2;
-    if (node.width < 50) {
-      node.width = 50;
+    let radius = 5;
+    const cal_height = (((node?.height ?? 0) - labelPaddingY * 2) * 10) / 11;
+    if (cal_height / 10 > 5) {
+      radius = cal_height / 10;
     }
 
-    // Adjustments for circular arc
-    const radiusAdjustment = Math.max(5, (node.height ?? 0) * 0.16667);
+    node.width = (node?.width ?? 0) - labelPaddingX * 2 - radius * 2;
+    if (node.width < 10) {
+      node.width = 10;
+    }
 
-    node.height = (node?.height ?? 0) - labelPaddingY * 2 - radiusAdjustment;
-    if (node.height < 50) {
-      node.height = 50;
+    node.height = (node?.height ?? 0) - labelPaddingY * 2 - radius * 2;
+    if (node.height < 10) {
+      node.height = 10;
     }
   }
 
-  const w = Math.max(bbox.width, node.width ?? 0) + (labelPaddingX ?? 0) * 2;
-  const h = Math.max(bbox.height, node.height ?? 0) + (labelPaddingY ?? 0) * 2;
+  const w = (node.width ? node.width : bbox.width) + (labelPaddingX ?? 0) * 2;
+  const h = (node.height ? node.height : bbox.height) + (labelPaddingY ?? 0) * 2;
   const radius = Math.max(5, h * 0.1);
 
   const { cssStyles } = node;
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraces.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraces.ts
index f1b210ca8..c5199a806 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraces.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/curlyBraces.ts
@@ -42,24 +42,26 @@ export const curlyBraces = async (parent: SVGAElement, node: Node) => {
   const labelPaddingY = node.look === 'neo' ? (node.padding ?? 0) * 1 : (node.padding ?? 0);
 
   if (node.width || node.height) {
-    node.width = (node?.width ?? 0) - labelPaddingX * 2;
-    if (node.width < 50) {
-      node.width = 50;
+    let radius = 5;
+    const cal_height = (((node?.height ?? 0) - labelPaddingY * 2) * 10) / 11;
+    if (cal_height / 10 > 5) {
+      radius = cal_height / 10;
     }
 
-    // Adjustments for circular arc
-    const radiusAdjustment = Math.max(5, (node.height ?? 0) * 0.16667);
+    node.width = (node?.width ?? 0) - labelPaddingX * 2 - radius * 2.5;
+    if (node.width < 10) {
+      node.width = 10;
+    }
 
-    node.height = (node?.height ?? 0) - labelPaddingY * 2 - radiusAdjustment;
-    if (node.height < 50) {
-      node.height = 50;
+    node.height = (node?.height ?? 0) - labelPaddingY * 2 - radius * 2;
+    if (node.height < 10) {
+      node.height = 10;
     }
   }
 
-  const w = Math.max(bbox.width, node.width ?? 0) + (labelPaddingX ?? 0) * 2;
-  const h = Math.max(bbox.height, node.height ?? 0) + (labelPaddingY ?? 0) * 2;
+  const w = (node.width ? node.width : bbox.width) + (labelPaddingX ?? 0) * 2;
+  const h = (node.height ? node.height : bbox.height) + (labelPaddingY ?? 0) * 2;
   const radius = Math.max(5, h * 0.1);
-
   const { cssStyles } = node;
 
   const leftCurlyBracePoints = [