diff --git a/invokeai/frontend/web/src/features/imageDeletion/components/DeleteImageModal.tsx b/invokeai/frontend/web/src/features/imageDeletion/components/DeleteImageModal.tsx
index cdc8257488..8306437cc7 100644
--- a/invokeai/frontend/web/src/features/imageDeletion/components/DeleteImageModal.tsx
+++ b/invokeai/frontend/web/src/features/imageDeletion/components/DeleteImageModal.tsx
@@ -23,6 +23,7 @@ import { stateSelector } from 'app/store/store';
 import {
   imageDeletionConfirmed,
   imageToDeleteCleared,
+  isModalOpenChanged,
   selectImageUsage,
 } from '../store/imageDeletionSlice';
 
@@ -63,6 +64,7 @@ const DeleteImageModal = () => {
 
   const handleClose = useCallback(() => {
     dispatch(imageToDeleteCleared());
+    dispatch(isModalOpenChanged(false));
   }, [dispatch]);
 
   const handleDelete = useCallback(() => {
diff --git a/invokeai/frontend/web/src/features/imageDeletion/store/imageDeletionSlice.ts b/invokeai/frontend/web/src/features/imageDeletion/store/imageDeletionSlice.ts
index 0daffba0d7..49630bcdb4 100644
--- a/invokeai/frontend/web/src/features/imageDeletion/store/imageDeletionSlice.ts
+++ b/invokeai/frontend/web/src/features/imageDeletion/store/imageDeletionSlice.ts
@@ -31,6 +31,7 @@ const imageDeletion = createSlice({
     },
     imageToDeleteCleared: (state) => {
       state.imageToDelete = null;
+      state.isModalOpen = false;
     },
   },
 });