diff --git a/packages/react/src/components/EdgeWrapper/index.tsx b/packages/react/src/components/EdgeWrapper/index.tsx
index cb9b9c8b..28323a19 100644
--- a/packages/react/src/components/EdgeWrapper/index.tsx
+++ b/packages/react/src/components/EdgeWrapper/index.tsx
@@ -186,6 +186,7 @@ export function EdgeWrapper({
             animated: edge.animated,
             inactive: !isSelectable && !onClick,
             updating: updateHover,
+            selectable: isSelectable,
           },
         ])}
         onClick={onEdgeClick}
diff --git a/packages/system/src/styles/init.css b/packages/system/src/styles/init.css
index a688f6b9..14519c74 100644
--- a/packages/system/src/styles/init.css
+++ b/packages/system/src/styles/init.css
@@ -139,8 +139,8 @@
   }
 
   &.selected .xy-flow__edge-path,
-  &:focus .xy-flow__edge-path,
-  &:focus-visible .xy-flow__edge-path {
+  &.selectable:focus .xy-flow__edge-path,
+  &.selectable:focus-visible .xy-flow__edge-path {
     stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));
   }