diff --git a/src/lib/components/chat/Messages/Error.svelte b/src/lib/components/chat/Messages/Error.svelte
index a1fed2f42..3cac9e1cd 100644
--- a/src/lib/components/chat/Messages/Error.svelte
+++ b/src/lib/components/chat/Messages/Error.svelte
@@ -1,26 +1,15 @@
 <script lang="ts">
+	import Info from '$lib/components/icons/Info.svelte';
+
 	export let content = '';
 </script>
 
-<div
-	class="flex mt-2 mb-4 space-x-2 border px-4 py-3 border-red-800 bg-red-800/30 font-medium rounded-lg"
->
-	<svg
-		xmlns="http://www.w3.org/2000/svg"
-		fill="none"
-		viewBox="0 0 24 24"
-		stroke-width="1.5"
-		stroke="currentColor"
-		class="w-5 h-5 self-center"
-	>
-		<path
-			stroke-linecap="round"
-			stroke-linejoin="round"
-			d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z"
-		/>
-	</svg>
+<div class="flex my-2 gap-2.5 border px-4 py-3 border-red-800 bg-red-800/30 font-medium rounded-lg">
+	<div class=" self-start mt-0.5">
+		<Info className="size-5" />
+	</div>
 
-	<div class=" self-center">
+	<div class=" self-center text-sm">
 		{content}
 	</div>
 </div>