diff --git a/packages/frontend/core/src/components/page-detail-editor.tsx b/packages/frontend/core/src/components/page-detail-editor.tsx
index 47b14f13b3..4ced924b0a 100644
--- a/packages/frontend/core/src/components/page-detail-editor.tsx
+++ b/packages/frontend/core/src/components/page-detail-editor.tsx
@@ -25,6 +25,10 @@ export interface PageDetailEditorProps {
   readonly?: boolean;
 }
 
+type DocMetaWithHeaderImage = {
+  headerImage?: string;
+};
+
 export const PageDetailEditor = ({
   onLoad,
   readonly,
@@ -34,6 +38,7 @@ export const PageDetailEditor = ({
   const defaultOpenProperty = useLiveData(editor.defaultOpenProperty$);
 
   const doc = useService(DocService).doc;
+  const docMeta = useLiveData(doc.meta$) as DocMetaWithHeaderImage | null;
   const pageWidth = useLiveData(doc.properties$.selector(p => p.pageWidth));
 
   const isSharedMode = editor.isSharedMode;
@@ -54,17 +59,33 @@ export const PageDetailEditor = ({
   }, [editor, readonly]);
 
   return (
-    <BlockSuiteEditor
-      className={clsx(styles.editor, {
-        'full-screen': !isSharedMode && fullWidthLayout,
-        'is-public': isSharedMode,
-      })}
-      mode={mode}
-      defaultOpenProperty={defaultOpenProperty}
-      page={editor.doc.blockSuiteDoc}
-      shared={isSharedMode}
-      readonly={readonly}
-      onEditorReady={onLoad}
-    />
+    <>
+      {docMeta?.headerImage && (
+        <img
+          src={docMeta.headerImage}
+          alt="Document header"
+          style={{
+            width: '100%',
+            maxHeight: 240,
+            objectFit: 'cover',
+            borderRadius: 8,
+            marginBottom: 12,
+          }}
+        />
+      )}
+
+      <BlockSuiteEditor
+        className={clsx(styles.editor, {
+          'full-screen': !isSharedMode && fullWidthLayout,
+          'is-public': isSharedMode,
+        })}
+        mode={mode}
+        defaultOpenProperty={defaultOpenProperty}
+        page={editor.doc.blockSuiteDoc}
+        shared={isSharedMode}
+        readonly={readonly}
+        onEditorReady={onLoad}
+      />
+    </>
   );
 };