diff --git a/packages/mermaid/src/diagrams/c4/svgDraw.js b/packages/mermaid/src/diagrams/c4/svgDraw.js
index e34a9d37f3..690dd26ad1 100644
--- a/packages/mermaid/src/diagrams/c4/svgDraw.js
+++ b/packages/mermaid/src/diagrams/c4/svgDraw.js
@@ -234,7 +234,7 @@ export const drawC4Shape = function (elem, c4Shape, conf) {
   const c4ShapeElem = elem.append('g');
   c4ShapeElem.attr('class', 'person-man');
 
-  // <rect fill="#08427B" height="119.2188" rx="2.5" ry="2.5" style="stroke:#073B6F;stroke-width:0.5;" width="110" x="120" y="7"/>
+  // <rect fill="#08427B" height="119.2188" rx="2.5" ry="2.5" stroke="#073B6F" stroke-width="0.5" width="110" x="120" y="7"/>
   // draw rect of c4Shape
   const rect = getNoteRect();
   switch (c4Shape.typeC4Shape.text) {
@@ -251,9 +251,10 @@ export const drawC4Shape = function (elem, c4Shape, conf) {
       rect.fill = fillColor;
       rect.width = c4Shape.width;
       rect.height = c4Shape.height;
-      rect.style = 'stroke:' + strokeColor + ';stroke-width:0.5;';
+      rect.stroke = strokeColor;
       rect.rx = 2.5;
       rect.ry = 2.5;
+      rect.attrs = { 'stroke-width': 0.5 };
       drawRect(c4ShapeElem, rect);
       break;
     case 'system_db':