diff --git a/src/frontend/src/App.css b/src/frontend/src/App.css
index e43432537..1314e6fb1 100644
--- a/src/frontend/src/App.css
+++ b/src/frontend/src/App.css
@@ -151,10 +151,13 @@ body {
 /* selected */
 .react-flow__edge.selected .react-flow__edge-path {
   stroke: var(--selected) !important;
+  stroke-width: 1.5px !important;
 }
 
 .react-flow__edge .react-flow__edge-path {
   stroke: var(--connection) !important;
+  transition: all;
+  transition-duration: 150ms;
 }
 
 .ag-react-container {
diff --git a/src/frontend/src/CustomNodes/GenericNode/components/NodeStatus/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/NodeStatus/index.tsx
index 7e7655b74..111516fc0 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/NodeStatus/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/NodeStatus/index.tsx
@@ -65,9 +65,9 @@ export default function NodeStatus({
 
   const getBaseBorderClass = (selected) => {
     let className = selected
-      ? "border border-2 border-node-selected hover:shadow-node"
+      ? "border ring ring-[0.5px] ring-selected border-selected hover:shadow-node"
       : "border hover:shadow-node";
-    let frozenClass = selected ? "border-ring-frozen" : "border-frozen";
+    let frozenClass = selected ? "outline-ring-frozen" : "outline-frozen";
     return frozen ? frozenClass : className;
   };