diff --git a/browser_tests/tests/selectionToolbox.spec.ts b/browser_tests/tests/selectionToolbox.spec.ts
index 90568e3aa0..ce45eb3fbf 100644
--- a/browser_tests/tests/selectionToolbox.spec.ts
+++ b/browser_tests/tests/selectionToolbox.spec.ts
@@ -43,7 +43,7 @@ test.describe('Selection Toolbox', () => {
     const boundingBox = await toolboxContainer.boundingBox()
     expect(boundingBox).not.toBeNull()
     // Canvas-based positioning can vary, just verify toolbox appears in reasonable bounds
-    expect(boundingBox!.x).toBeGreaterThan(-100) // Not too far off-screen left
+    expect(boundingBox!.x).toBeGreaterThan(-200) // Not too far off-screen left
     expect(boundingBox!.x).toBeLessThan(1000) // Not too far off-screen right
     expect(boundingBox!.y).toBeGreaterThan(-100) // Not too far off-screen top
   })
diff --git a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-nodes-border-chromium-linux.png b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-nodes-border-chromium-linux.png
index 12215637fd..5ebf260094 100644
Binary files a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-nodes-border-chromium-linux.png and b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-nodes-border-chromium-linux.png differ
diff --git a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-selections-border-chromium-linux.png b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-selections-border-chromium-linux.png
index a2d11d3503..5ebf260094 100644
Binary files a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-selections-border-chromium-linux.png and b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-multiple-selections-border-chromium-linux.png differ
diff --git a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-single-selection-no-border-chromium-linux.png b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-single-selection-no-border-chromium-linux.png
index 8017b8f49d..89ddf1b9b7 100644
Binary files a/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-single-selection-no-border-chromium-linux.png and b/browser_tests/tests/selectionToolbox.spec.ts-snapshots/selection-toolbox-single-selection-no-border-chromium-linux.png differ
diff --git a/src/components/graph/SelectionToolbox.vue b/src/components/graph/SelectionToolbox.vue
index 2caca6bcf1..38f0a2c0d0 100644
--- a/src/components/graph/SelectionToolbox.vue
+++ b/src/components/graph/SelectionToolbox.vue
@@ -1,16 +1,13 @@
 <template>
-  <Transition name="slide-up">
-    <!-- Wrapping panel in div to get correct ref because panel ref is not of raw dom el -->
-    <div
-      v-show="visible"
-      ref="toolboxRef"
-      style="
-        transform: translate(calc(var(--tb-x) - 50%), calc(var(--tb-y) - 120%));
-      "
-      class="selection-toolbox fixed left-0 top-0 z-40"
-    >
+  <div
+    ref="toolboxRef"
+    style="transform: translate(var(--tb-x), var(--tb-y))"
+    class="fixed left-0 top-0 z-40"
+  >
+    <Transition name="slide-up">
       <Panel
-        class="rounded-lg"
+        v-if="visible"
+        class="rounded-lg selection-toolbox"
         :pt="{
           header: 'hidden',
           content: 'p-0 flex flex-row'
@@ -33,8 +30,8 @@
         />
         <HelpButton />
       </Panel>
-    </div>
-  </Transition>
+    </Transition>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -84,22 +81,31 @@ const extensionToolboxCommands = computed<ComfyCommandImpl[]>(() => {
 </script>
 
 <style scoped>
+.selection-toolbox {
+  transform: translateX(-50%) translateY(-120%);
+  will-change: transform, opacity;
+}
+
+@keyframes slideUp {
+  0% {
+    transform: translateX(-50%) translateY(-100%);
+    opacity: 0;
+  }
+  50% {
+    transform: translateX(-50%) translateY(-125%);
+    opacity: 0.5;
+  }
+  100% {
+    transform: translateX(-50%) translateY(-120%);
+    opacity: 1;
+  }
+}
+
 .slide-up-enter-active {
-  opacity: 1;
-  transition: all 0.3s ease-out;
+  animation: slideUp 125ms ease-out;
 }
 
 .slide-up-leave-active {
-  transition: none;
-}
-
-.slide-up-enter-from {
-  transform: translateY(-100%);
-  opacity: 0;
-}
-
-.slide-up-leave-to {
-  transform: translateY(0);
-  opacity: 0;
+  animation: slideUp 25ms ease-out reverse;
 }
 </style>