diff --git a/packages/react/src/container/EdgeRenderer/MarkerSymbols.tsx b/packages/react/src/container/EdgeRenderer/MarkerSymbols.tsx
index 8ae3bb52..13ebfd92 100644
--- a/packages/react/src/container/EdgeRenderer/MarkerSymbols.tsx
+++ b/packages/react/src/container/EdgeRenderer/MarkerSymbols.tsx
@@ -8,10 +8,12 @@ type SymbolProps = Omit<EdgeMarker, 'type'>;
 const ArrowSymbol = ({ color = 'none', strokeWidth = 1 }: SymbolProps) => {
   return (
     <polyline
-      stroke={color}
+      style={{
+        stroke: color,
+        strokeWidth,
+      }}
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={strokeWidth}
       fill="none"
       points="-5,-4 0,0 -5,4"
     />
@@ -21,11 +23,13 @@ const ArrowSymbol = ({ color = 'none', strokeWidth = 1 }: SymbolProps) => {
 const ArrowClosedSymbol = ({ color = 'none', strokeWidth = 1 }: SymbolProps) => {
   return (
     <polyline
-      stroke={color}
+      style={{
+        stroke: color,
+        fill: color,
+        strokeWidth,
+      }}
       strokeLinecap="round"
       strokeLinejoin="round"
-      strokeWidth={strokeWidth}
-      fill={color}
       points="-5,-4 0,0 -5,4 -5,-4"
     />
   );