diff --git a/src/app/components/VoiceWidget.svelte b/src/app/components/VoiceWidget.svelte
index 373ab5e0..8621d36b 100644
--- a/src/app/components/VoiceWidget.svelte
+++ b/src/app/components/VoiceWidget.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import {fly} from "svelte/transition"
   import {ifLet} from "@welshman/lib"
   import {displayRelayUrl} from "@welshman/util"
   import Microphone from "@assets/icons/microphone.svg?dataurl"
@@ -26,7 +27,10 @@
 </script>
 
 {#if $currentVoiceSession}
-  <div class="flex flex-col gap-2 rounded-box bg-base-100 p-3">
+  <div
+    in:fly={{y: 60, duration: 350}}
+    out:fly={{y: 60, duration: 250}}
+    class="flex flex-col gap-2 rounded-box bg-base-100 p-3">
     <div class="flex items-start justify-between gap-2">
       <div class="min-w-0 flex flex-col gap-0.5">
         <span class="text-sm font-semibold text-success">Voice Connected</span>