diff --git a/packages/client/src/components/divider.tsx b/packages/client/src/components/divider.tsx
index fed9059b..0915b019 100644
--- a/packages/client/src/components/divider.tsx
+++ b/packages/client/src/components/divider.tsx
@@ -1,13 +1,13 @@
 import React from 'react';
 
-export const _Divider = ({ vertical = false }) => {
+export const _Divider = ({ vertical = false, margin = 6 }) => {
   return (
     <div
       style={{
         display: 'inline-block',
         width: 1,
         height: 18,
-        margin: '0 6px',
+        margin: `0 ${margin}px`,
         backgroundColor: 'var(--semi-color-border)',
         transform: `rotate(${vertical ? 90 : 0}deg)`,
       }}
diff --git a/packages/client/src/components/document/reader/public/index.tsx b/packages/client/src/components/document/reader/public/index.tsx
index 55f2b564..25104ffe 100644
--- a/packages/client/src/components/document/reader/public/index.tsx
+++ b/packages/client/src/components/document/reader/public/index.tsx
@@ -10,6 +10,7 @@ import {
 } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
 import { DataRender } from 'components/data-render';
+import { Divider } from 'components/divider';
 import { DocumentStyle } from 'components/document/style';
 import { LogoImage, LogoText } from 'components/logo';
 import { Seo } from 'components/seo';
@@ -131,10 +132,13 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
           mode="horizontal"
           header={
             !hideLogo && !isMobile ? (
-              <Space style={{ marginRight: 12 }}>
-                <LogoImage />
-                <LogoText />
-              </Space>
+              <>
+                <Space>
+                  <LogoImage />
+                  <LogoText />
+                </Space>
+                <Divider margin={12} />
+              </>
             ) : null
           }
           footer={