diff --git a/.changeset/short-ligers-help.md b/.changeset/short-ligers-help.md
new file mode 100644
index 00000000..05aec835
--- /dev/null
+++ b/.changeset/short-ligers-help.md
@@ -0,0 +1,5 @@
+---
+"@vue-flow/core": minor
+---
+
+Use correct end handle position in connection line component and store handle positions during connections.
diff --git a/packages/core/src/components/ConnectionLine/index.ts b/packages/core/src/components/ConnectionLine/index.ts
index 2565b49d..025ec562 100644
--- a/packages/core/src/components/ConnectionLine/index.ts
+++ b/packages/core/src/components/ConnectionLine/index.ts
@@ -93,8 +93,7 @@ const ConnectionLine = defineComponent({
         }
       }
 
-      // we assume the target position is opposite to the source position
-      const toPosition = fromPosition ? oppositePosition[fromPosition] : null
+      const toPosition = connectionEndHandle.value?.position ?? (fromPosition ? oppositePosition[fromPosition] : null)
 
       if (!fromPosition || !toPosition) {
         return null
diff --git a/packages/core/src/composables/useHandle.ts b/packages/core/src/composables/useHandle.ts
index 27a5fd86..de6f0ded 100644
--- a/packages/core/src/composables/useHandle.ts
+++ b/packages/core/src/composables/useHandle.ts
@@ -15,6 +15,7 @@ import {
   rendererPointToPoint,
   resetRecentHandle,
 } from '../utils'
+import { Position } from '../types'
 import { useVueFlow } from './useVueFlow'
 
 export interface UseHandleProps {
@@ -129,6 +130,7 @@ export function useHandle({
           nodeId: toValue(nodeId),
           handleId: toValue(handleId),
           type: handleType,
+          position: (clickedHandle?.getAttribute('data-handlepos') as Position) || Position.Top,
         },
         {
           x: x - containerBounds.left,
diff --git a/packages/core/src/types/handle.ts b/packages/core/src/types/handle.ts
index 9c0de3de..55b04b47 100644
--- a/packages/core/src/types/handle.ts
+++ b/packages/core/src/types/handle.ts
@@ -26,7 +26,8 @@ export interface ValidHandleResult {
 export interface ConnectingHandle {
   nodeId: string
   type: HandleType
-  handleId: string | null
+  handleId?: string | null
+  position?: Position | null
 }
 
 /** A valid connection function can determine if an attempted connection is valid or not, i.e. abort creating a new edge */
diff --git a/packages/core/src/utils/handle.ts b/packages/core/src/utils/handle.ts
index c77c85b3..c28e3824 100644
--- a/packages/core/src/utils/handle.ts
+++ b/packages/core/src/utils/handle.ts
@@ -8,6 +8,7 @@ import type {
   GraphNode,
   HandleType,
   NodeHandleBounds,
+  Position,
   ValidConnectionFunc,
   ValidHandleResult,
   XYPosition,
@@ -192,12 +193,6 @@ export function isValidHandle(
         ? (isTarget && handleType === 'source') || (!isTarget && handleType === 'target')
         : handleNodeId !== fromNodeId || handleId !== fromHandleId)
 
-    result.endHandle = {
-      nodeId: handleNodeId,
-      handleId,
-      type: handleType as HandleType,
-    }
-
     if (isValid) {
       result.isValid = isValidConnection(connection, {
         edges,
@@ -205,6 +200,13 @@ export function isValidHandle(
         sourceNode: findNode(connection.source)!,
         targetNode: findNode(connection.target)!,
       })
+
+      result.endHandle = {
+        nodeId: handleNodeId,
+        handleId,
+        type: handleType as HandleType,
+        position: result.isValid ? (handleToCheck.getAttribute('data-handlepos') as Position) : null,
+      }
     }
   }