diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte
index df07c25f66..cf6973e98e 100644
--- a/src/lib/components/chat/Messages/ResponseMessage.svelte
+++ b/src/lib/components/chat/Messages/ResponseMessage.svelte
@@ -690,7 +690,7 @@
 								{#each message.files.filter((f) => ['image', 'file'].includes(f.type)) as file}
 									<div>
 										{#if file.type === 'image' || (file?.content_type ?? '').startsWith('image/')}
-											<Image src={file.url} alt={message.content} />
+											<Image src={file.url} alt={file.name || $i18n.t('Generated Image')} />
 										{:else}
 											<FileItem
 												item={file}
diff --git a/src/lib/components/common/Image.svelte b/src/lib/components/common/Image.svelte
index 76cc6ccd1e..7d535fca4c 100644
--- a/src/lib/components/common/Image.svelte
+++ b/src/lib/components/common/Image.svelte
@@ -5,6 +5,7 @@
 	import { settings } from '$lib/stores';
 	import ImagePreview from './ImagePreview.svelte';
 	import XMark from '$lib/components/icons/XMark.svelte';
+	import Photo from '$lib/components/icons/Photo.svelte';
 	import { getContext } from 'svelte';
 
 	export let src = '';
@@ -18,27 +19,62 @@
 	export let dismissible = false;
 	export let onDismiss = () => {};
 
+	/** Called when the image fails to load, e.g. its file has since been deleted. */
+	export let onError: () => void = () => {};
+
 	const i18n = getContext('i18n');
 
 	let _src = '';
 	$: _src = safeImageUrl(src.startsWith('/') ? `${WEBUI_BASE_URL}${src}` : src, allowExternal);
 
 	let showImagePreview = false;
+
+	let failed = false;
+	let attemptedSrc = '';
+	$: if (_src !== attemptedSrc) {
+		attemptedSrc = _src;
+		failed = false;
+	}
+
+	const handleError = () => {
+		failed = true;
+		showImagePreview = false;
+		onError();
+	};
 </script>
 
-<ImagePreview bind:show={showImagePreview} src={_src} {alt} />
+{#if !failed}
+	<ImagePreview bind:show={showImagePreview} src={_src} {alt} />
+{/if}
 
 <div class=" relative group w-fit flex items-center">
-	<button
-		class={className}
-		on:click={() => {
-			showImagePreview = true;
-		}}
-		aria-label={$i18n.t('Show image preview')}
-		type="button"
-	>
-		<img src={_src} {alt} class={imageClassName} draggable="false" data-cy="image" />
-	</button>
+	{#if failed}
+		<div
+			class="{imageClassName} flex items-center gap-2 px-3 py-2.5 border border-dashed border-gray-200 dark:border-gray-800 text-gray-400 dark:text-gray-600"
+			data-cy="image-unavailable"
+		>
+			<Photo className="size-4 shrink-0" strokeWidth="1.5" />
+			<span class="text-xs">{$i18n.t('Image unavailable')}</span>
+		</div>
+	{:else}
+		<button
+			class={className}
+			on:click={() => {
+				showImagePreview = true;
+			}}
+			aria-label={$i18n.t('Show image preview')}
+			type="button"
+		>
+			<img
+				src={_src}
+				{alt}
+				class={imageClassName}
+				draggable="false"
+				data-cy="image"
+				on:error={handleError}
+			/>
+		</button>
+	{/if}
 
 	{#if dismissible}
 		<div class=" absolute -top-1 -right-1">
diff --git a/src/lib/i18n/locales/en-US/translation.json b/src/lib/i18n/locales/en-US/translation.json
index 1f15676d7f..8764964f6d 100644
--- a/src/lib/i18n/locales/en-US/translation.json
+++ b/src/lib/i18n/locales/en-US/translation.json
@@ -1406,6 +1406,7 @@
 	"Image Prompt Generation": "",
 	"Image Prompt Generation Prompt": "",
 	"Image Size": "",
+	"Image unavailable": "",
 	"image/*, video/*": "",
 	"Images": "",
 	"Import": "",