diff --git a/website/package.json b/website/package.json
index 1c92674..73658c1 100644
--- a/website/package.json
+++ b/website/package.json
@@ -25,7 +25,7 @@
     "@uiw/codemirror-theme-xcode": "^4.11.6",
     "@uiw/react-back-to-top": "^1.2.0",
     "@uiw/react-github-corners": "^1.5.15",
-    "@uiw/react-markdown-editor": "^5.6.2",
+    "@uiw/react-markdown-editor": "^5.7.0",
     "@wcj/dark-mode": "^1.0.15",
     "css-tree": "^2.2.1",
     "react": "^18.2.0",
diff --git a/website/src/pages/home/index.tsx b/website/src/pages/home/index.tsx
index fbe608a..41fdbaa 100644
--- a/website/src/pages/home/index.tsx
+++ b/website/src/pages/home/index.tsx
@@ -27,6 +27,7 @@ export const HomePage = () => {
         toolbarsMode={[cssCommand, previeTheme, copy, 'fullscreen', 'preview']}
         extensions={[EditorView.lineWrapping]}
         renderPreview={Preview}
+        previewWidth="420px"
         onChange={handleChange}
         visible={true}
         height="calc(100vh - 4.70rem)"
diff --git a/website/src/pages/theme/editor.tsx b/website/src/pages/theme/editor.tsx
index b19af95..b4f6345 100644
--- a/website/src/pages/theme/editor.tsx
+++ b/website/src/pages/theme/editor.tsx
@@ -26,6 +26,7 @@ export const EditorPage = () => {
         toolbarsMode={toolbarsMode}
         reExtensions={[EditorView.lineWrapping, cssLang()]}
         renderPreview={Preview}
+        previewWidth="420px"
         onChange={handleChange}
         visible={true}
         height="calc(100vh - 4.92rem)"