diff --git a/packages/ui/src/views/canvas/index.css b/packages/ui/src/views/canvas/index.css
index 851dee5b923..b7bb04d8f18 100644
--- a/packages/ui/src/views/canvas/index.css
+++ b/packages/ui/src/views/canvas/index.css
@@ -35,3 +35,13 @@
     flex-grow: 1;
     height: 100%;
 }
+
+.chatflow-canvas .react-flow__handle-connecting {
+  cursor: not-allowed;
+  background: #db4e4e !important;
+}
+
+.chatflow-canvas .react-flow__handle-valid {
+  cursor: crosshair;
+  background: #5dba62 !important;
+}
\ No newline at end of file
diff --git a/packages/ui/src/views/canvas/index.jsx b/packages/ui/src/views/canvas/index.jsx
index 42605054755..b2cef5600ef 100644
--- a/packages/ui/src/views/canvas/index.jsx
+++ b/packages/ui/src/views/canvas/index.jsx
@@ -554,6 +554,7 @@ const Canvas = () => {
                                 fitView
                                 deleteKeyCode={canvas.canvasDialogShow ? null : ['Delete']}
                                 minZoom={0.1}
+                                className='chatflow-canvas'
                             >
                                 <Controls
                                     style={{