diff --git a/apps/electron/src/main/export/pdf.ts b/apps/electron/src/main/export/pdf.ts
index b54d4ea4bf..9748d98e88 100644
--- a/apps/electron/src/main/export/pdf.ts
+++ b/apps/electron/src/main/export/pdf.ts
@@ -1,4 +1,4 @@
-import { BrowserWindow, dialog, shell } from 'electron';
+import { BrowserWindow, dialog } from 'electron';
 import fs from 'fs-extra';
 
 import { logger } from '../logger';
@@ -49,8 +49,6 @@ export async function savePDFFileAs(
           logger.log(`Wrote PDF successfully to ${filePath}`);
         });
       });
-
-    await shell.openPath(filePath);
     return { filePath };
   } catch (err) {
     logger.error('savePDFFileAs', err);
diff --git a/apps/web/src/layouts/workspace-layout.tsx b/apps/web/src/layouts/workspace-layout.tsx
index 8990167783..3dc3caae02 100644
--- a/apps/web/src/layouts/workspace-layout.tsx
+++ b/apps/web/src/layouts/workspace-layout.tsx
@@ -1,6 +1,7 @@
 import { Content, displayFlex } from '@affine/component';
 import { AffineWatermark } from '@affine/component/affine-watermark';
 import { appSidebarResizingAtom } from '@affine/component/app-sidebar';
+import { NotificationCenter } from '@affine/component/notification-center';
 import type { DraggableTitleCellData } from '@affine/component/page-list';
 import { StyledTitleLink } from '@affine/component/page-list';
 import {
@@ -444,6 +445,7 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
         <PageListTitleCellDragOverlay />
       </DndContext>
       <QuickSearch />
+      <NotificationCenter />
       <Setting />
     </>
   );
diff --git a/packages/component/src/components/page-list/operation-menu-items/export.tsx b/packages/component/src/components/page-list/operation-menu-items/export.tsx
index a89301b9b0..c86fc8b7c1 100644
--- a/packages/component/src/components/page-list/operation-menu-items/export.tsx
+++ b/packages/component/src/components/page-list/operation-menu-items/export.tsx
@@ -1,3 +1,4 @@
+import { pushNotificationAtom } from '@affine/component/notification-center';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type { PageBlockModel } from '@blocksuite/blocks';
 import { ContentParser } from '@blocksuite/blocks/content-parser';
@@ -7,7 +8,9 @@ import {
   ExportToHtmlIcon,
   ExportToMarkdownIcon,
   ExportToPdfIcon,
+  ExportToPngIcon,
 } from '@blocksuite/icons';
+import { useSetAtom } from 'jotai';
 import { useCallback, useRef } from 'react';
 
 import { Menu, MenuItem } from '../../..';
@@ -19,43 +22,73 @@ const ExportToPdfMenuItem = ({
   const t = useAFFiNEI18N();
   const contentParserRef = useRef<ContentParser>();
   const { currentEditor } = globalThis;
+  const setPushNotification = useSetAtom(pushNotificationAtom);
+
   const onClickDownloadPDF = useCallback(() => {
     if (!currentEditor) {
       return;
     }
-    const contentParser =
-      contentParserRef.current ??
-      (contentParserRef.current = new ContentParser(currentEditor.page));
 
-    window.apis?.export
-      .savePDFFileAs(
-        (currentEditor.page.root as PageBlockModel).title.toString()
-      )
-      .then(result => {
-        if (result !== undefined) {
-          return;
-        }
-        return contentParser.exportPdf();
-      })
-      .then(() => {
-        onSelect?.({ type: 'pdf' });
-      })
-      .catch(err => {
-        console.error(err);
-      });
-  }, [currentEditor, onSelect]);
-  if (currentEditor && currentEditor.mode === 'page') {
-    return (
-      <MenuItem
-        data-testid="export-to-pdf"
-        onClick={onClickDownloadPDF}
-        icon={<ExportToPdfIcon />}
-      >
-        {t['Export to PDF']()}
-      </MenuItem>
-    );
-  }
-  return null;
+    if (environment.isDesktop && currentEditor.mode === 'page') {
+      window.apis?.export
+        .savePDFFileAs(
+          (currentEditor.page.root as PageBlockModel).title.toString()
+        )
+        .then(() => {
+          onSelect?.({ type: 'pdf' });
+          setPushNotification({
+            key: 'export-to-pdf',
+            title: 'export',
+            message: 'Export success',
+            type: 'success',
+          });
+        })
+        .catch(err => {
+          console.error(err);
+          setPushNotification({
+            key: 'export-to-pdf',
+            title: 'export',
+            message: 'Export error',
+            type: 'error',
+          });
+        });
+    } else {
+      const contentParser =
+        contentParserRef.current ??
+        (contentParserRef.current = new ContentParser(currentEditor.page));
+
+      contentParser
+        .exportPdf()
+        .then(() => {
+          onSelect?.({ type: 'pdf' });
+          setPushNotification({
+            key: 'export-to-pdf',
+            title: 'export',
+            message: 'Export success',
+            type: 'success',
+          });
+        })
+        .catch(err => {
+          console.error(err);
+          setPushNotification({
+            key: 'export-to-pdf',
+            title: 'export',
+            message: 'Export error',
+            type: 'error',
+          });
+        });
+    }
+  }, [currentEditor, onSelect, setPushNotification]);
+
+  return (
+    <MenuItem
+      data-testid="export-to-pdf"
+      onClick={onClickDownloadPDF}
+      icon={<ExportToPdfIcon />}
+    >
+      {t['Export to PDF']()}
+    </MenuItem>
+  );
 };
 
 const ExportToHtmlMenuItem = ({
@@ -89,33 +122,56 @@ const ExportToHtmlMenuItem = ({
   );
 };
 
-// const ExportToPngMenuItem = ({
-//   onSelect,
-// }: CommonMenuItemProps<{ type: 'png' }>) => {
-//   const t = useAFFiNEI18N();
-//   const contentParserRef = useRef<ContentParser>();
-//   return (
-//     <>
-//       {globalThis.currentEditor!.mode === 'page' && (
-//         <MenuItem
-//           data-testid="export-to-png"
-//           onClick={() => {
-//             if (!contentParserRef.current) {
-//               contentParserRef.current = new ContentParser(
-//                 globalThis.currentEditor!.page
-//               );
-//             }
-//             contentParserRef.current.exportPng();
-//             onSelect?.({ type: 'png' });
-//           }}
-//           icon={<ExportToPngIcon />}
-//         >
-//           {t['Export to PNG']()}
-//         </MenuItem>
-//       )}
-//     </>
-//   );
-// };
+const ExportToPngMenuItem = ({
+  onSelect,
+}: CommonMenuItemProps<{ type: 'png' }>) => {
+  const t = useAFFiNEI18N();
+  const contentParserRef = useRef<ContentParser>();
+  const { currentEditor } = globalThis;
+  const setPushNotification = useSetAtom(pushNotificationAtom);
+
+  const onClickDownloadPNG = useCallback(() => {
+    if (!currentEditor) {
+      return;
+    }
+    const contentParser =
+      contentParserRef.current ??
+      (contentParserRef.current = new ContentParser(currentEditor.page));
+
+    contentParser
+      .exportPng()
+      .then(() => {
+        onSelect?.({ type: 'png' });
+        setPushNotification({
+          key: 'export-to-pdf',
+          title: 'export',
+          message: 'Export success',
+          type: 'success',
+        });
+      })
+      .catch(err => {
+        console.error(err);
+        setPushNotification({
+          key: 'export-to-pdf',
+          title: 'export',
+          message: 'Export error',
+          type: 'error',
+        });
+      });
+  }, [currentEditor, onSelect, setPushNotification]);
+
+  return (
+    <>
+      <MenuItem
+        data-testid="export-to-png"
+        onClick={onClickDownloadPNG}
+        icon={<ExportToPngIcon />}
+      >
+        {t['Export to PNG']()}
+      </MenuItem>
+    </>
+  );
+};
 
 const ExportToMarkdownMenuItem = ({
   onSelect,
@@ -161,7 +217,7 @@ export const Export = ({
         <>
           <ExportToPdfMenuItem></ExportToPdfMenuItem>
           <ExportToHtmlMenuItem></ExportToHtmlMenuItem>
-          {/* <ExportToPngMenuItem></ExportToPngMenuItem> */}
+          <ExportToPngMenuItem></ExportToPngMenuItem>
           <ExportToMarkdownMenuItem></ExportToMarkdownMenuItem>
         </>
       }
diff --git a/packages/component/src/components/workspace/index.css.ts b/packages/component/src/components/workspace/index.css.ts
index 42e8076b26..2047f62f6b 100644
--- a/packages/component/src/components/workspace/index.css.ts
+++ b/packages/component/src/components/workspace/index.css.ts
@@ -65,6 +65,8 @@ export const mainContainerStyle = style({
       '@media': {
         print: {
           overflow: 'visible',
+          margin: '0px',
+          borderRadius: '0px',
         },
       },
     },