diff --git a/web/src/pages/chat/chat-container/index.less b/web/src/pages/chat/chat-container/index.less
index 1eba20a51..ac42b3ef3 100644
--- a/web/src/pages/chat/chat-container/index.less
+++ b/web/src/pages/chat/chat-container/index.less
@@ -47,3 +47,7 @@
 .referenceChunkImage {
   width: 10vw;
 }
+
+.referenceImagePreview {
+  width: 600px;
+}
diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx
index b3d70ca52..b1ac8ce3a 100644
--- a/web/src/pages/chat/chat-container/index.tsx
+++ b/web/src/pages/chat/chat-container/index.tsx
@@ -66,10 +66,20 @@ const MessageItem = ({
           gap={10}
           className={styles.referencePopoverWrapper}
         >
-          <Image
-            id={chunkItem?.img_id}
-            className={styles.referenceChunkImage}
-          ></Image>
+          <Popover
+            placement="topRight"
+            content={
+              <Image
+                id={chunkItem?.img_id}
+                className={styles.referenceImagePreview}
+              ></Image>
+            }
+          >
+            <Image
+              id={chunkItem?.img_id}
+              className={styles.referenceChunkImage}
+            ></Image>
+          </Popover>
           <Space direction={'vertical'}>
             <div>{chunkItem?.content_with_weight}</div>
             {documentId && (