diff --git a/web/components/loading.templ b/web/components/loading.templ
index dd4dfb2..9ec1c8e 100644
--- a/web/components/loading.templ
+++ b/web/components/loading.templ
@@ -1,10 +1,12 @@
 package ui
 
 templ LoadingIndicator(text string) {
-	<div class="inline-flex items-center gap-2 text-sm text-(--text-muted)">
-		<div class="h-1.5 w-1.5 bg-(--text-faint)"></div>
-		<div class="h-1.5 w-1.5 bg-(--text-faint)"></div>
-		<div class="h-1.5 w-1.5 bg-(--text-faint)"></div>
-		<span>{ text }</span>
+	<div class="flex flex-col items-center justify-center gap-4 py-12">
+		<div class="flex gap-1.5">
+			<span class="h-2 w-2 rounded-full bg-(--text-faint) animate-bounce" style="animation-delay: 0ms;"></span>
+			<span class="h-2 w-2 rounded-full bg-(--text-faint) animate-bounce" style="animation-delay: 150ms;"></span>
+			<span class="h-2 w-2 rounded-full bg-(--text-faint) animate-bounce" style="animation-delay: 300ms;"></span>
+		</div>
+		<span class="text-xs uppercase tracking-widest text-(--text-faint)">{ text }</span>
 	</div>
 }