Skip to content
Markdown 預覽
Tools

Markdown 預覽

編寫 Markdown,並排即時檢視算繪結果。

0 words
Export ▾

Runs entirely in your browser. Nothing is uploaded.

免費線上 Markdown 預覽與編輯器 — 支援 Mermaid 與 LaTeX

這款 Markdown 預覽工具在你輸入的同時即時並排渲染文字。在左側編輯器中輸入,格式化後的結果立即顯示在右側 — 標題、粗體、斜體、表格、任務清單、程式碼區塊、Mermaid 圖表和 KaTeX 數學公式,全部即時渲染。這是一款完全免費的 線上 Markdown 編輯器Markdown 檢視器,無需註冊、無限制、無需安裝任何東西。

由於一切都在瀏覽器中執行,隱私也有充分保障:你的文字在本地解析,自動儲存到你的裝置,絕不上傳至伺服器。這比 StackEditHackMDDillinger.io 等雲端編輯器更快、更私密 — 頁面載入後還可離線使用。

GitHub-Flavored Markdown,渲染效果符合預期

預覽器完整支援 GitHub-Flavored Markdown(GFM),因此表格、任務清單、刪除線、自動連結以及帶語法高亮的程式碼區塊的渲染效果與 GitHub README 完全一致。輸入管道符表格或 - [x] 清單,右側立即顯示格式化結果。

格式工具列支援一鍵插入粗體、斜體、刪除線、行內程式碼、標題、清單、引用、連結、圖片、表格和程式碼區塊。鍵盤快捷鍵(Ctrl+B、Ctrl+I、Ctrl+K、Ctrl+F)與桌面編輯器體驗一致。即時統計字數、字元數和閱讀時間,自動產生目錄,支援尋找與取代。

Mermaid 圖表、LaTeX 數學公式與語法高亮程式碼

這裡是它超越基礎預覽工具的地方。新增一個 ```mermaid 程式碼區塊,你的流程圖、序列圖、類別圖、甘特圖或圓餅圖就會即時渲染為自適應亮暗模式的 SVG。VS Code 內建預覽需要安裝「Markdown Preview Mermaid Support」擴充功能才能實現這一功能,而 Dillinger.io 和基礎版 Marked.js 示範則完全不支援 Mermaid。

輸入行內 $E = mc^2$ 或區塊 $$\int_0^\infty e^{-x^2} dx$$LaTeX 數學公式即由 KaTeX 即時排版。程式碼區塊由 highlight.js 對 180 餘種程式語言進行語法著色。

VS Code、Typora、Dillinger、StackEdit 與 Obsidian 的免安裝替代品

如果你平時使用 VS Code Markdown 預覽(Ctrl+Shift+V)或分欄檢視(Ctrl+K V),這個頁面無需開啟編輯器即可實現同樣效果。Typora 擁有獨特的無縫編輯模式,但需要付費 $14.99 — 本工具完全免費,無需安裝。

StackEdit 支援 KaTeX 和 Mermaid,但需要雲端同步帳號。HackMD 將文件儲存在自己的伺服器上。Obsidian 是一款需要安裝的應用程式。本工具在單一即時載入的頁面上提供 Mermaid + KaTeX + GFM + 匯出功能,同時保障完全的隱私。

匯出為 PDF、HTML 或 Markdown — 並透過 URL 分享

文件完成後,隨處可用。匯出為 PDF 將渲染頁面(含 Mermaid 圖表、KaTeX 數學公式和高亮程式碼)列印為檔案。下載 .html 儲存一個內嵌樣式的獨立網頁;下載 .md 保留原始碼。也可以複製乾淨的渲染 HTML 或富文字,貼到 Gmail、Google 文件或 Notion。

需要傳給別人?分享功能將整個文件編碼到連結中(經 LZ-string 壓縮),並將 URL 複製到剪貼板。開啟該連結,文字直接在編輯器中載入 — 無需帳號、無需伺服器、無需上傳。

安全輸出、自動儲存與完全隱私

預覽來自外部來源的 Markdown 不應帶來風險。解析後,本工具使用 DOMPurify 清理渲染後的 HTML,移除指令碼標籤、行內事件處理器和 javascript: URL,確保預覽內容忠實展示的同時防範 XSS 攻擊。

你輸入時,一切即時更新。草稿自動儲存到本地端儲存,關閉分頁不會遺失工作。無需註冊、無需上傳、無追蹤。無論是編寫文件、預覽 README、渲染 Mermaid 圖表和數學公式,還是將 Markdown 轉換為乾淨的 HTML 和 PDF — 這款即時 Markdown 預覽工具在一個快速、私密的頁面上完成所有工作。

Frequently asked questions

這款 Markdown 編輯器和預覽工具是免費的嗎?

是的 — 完全免費,無需註冊、無需帳號、無使用限制。一鍵開啟,完全在瀏覽器中執行。沒有檔案大小限制,沒有付費功能,這與 Dillinger.io(有廣告)、StackEdit(有雲端同步)或 HackMD(大多數功能需要帳號)不同。

我的 Markdown 內容是私密的嗎?

是的,完全私密。你的 Markdown 在瀏覽器中即時解析和渲染,自動儲存到裝置本地端儲存 — 任何內容都不會上傳至伺服器。頁面載入後,該工具可離線使用。

支援 GitHub-Flavored Markdown(GFM)嗎?

是的。預覽器完整支援 GFM — 帶對齊的管道符表格、帶核取方塊的任務清單(- [x] 和 - [ ])、~~雙波浪線~~刪除線、帶語法高亮的程式碼區塊、自動連結和 HTML 標籤。

能渲染 Mermaid 圖表嗎?

能。在 ```mermaid 程式碼區塊中放置圖表,預覽面板會將其即時渲染為 SVG。支援的圖表類型包括:流程圖、序列圖、類別圖、狀態圖、ER 圖、圓餅圖、甘特圖和 Git 圖。

能渲染 LaTeX 數學公式嗎?

能。行內數學(如 $E = mc^2$)和區塊數學($$…$$ 之間)均由 KaTeX 渲染。KaTeX 速度快(無需網路請求,本地執行),涵蓋絕大多數 LaTeX 數學符號。

程式碼區塊有語法高亮嗎?

有。程式碼區塊由 highlight.js 提供語法高亮,涵蓋 180 餘種程式語言。在程式碼圍欄後新增語言提示 — 例如 ```js、```python、```sql — 即可套用相應的配色主題。

如何不用 VS Code 預覽 Markdown?

只需將 Markdown 貼上或輸入到左側編輯器,渲染結果立即顯示在右側 — 無需 Visual Studio Code、無需擴充功能、無需安裝任何東西。

如何在 VS Code 中預覽 Markdown?

在 VS Code 中,開啟 .md 檔案後按 Ctrl+Shift+V(macOS 按 Cmd+Shift+V)在新分頁中開啟 Markdown 預覽,或按 Ctrl+K 再按 V 以分欄顯示。VS Code 內建預覽支援 CommonMark 和 GFM,但不安裝擴充功能的情況下無法渲染 Mermaid 圖表或 KaTeX 數學公式。

與 Dillinger.io 相比如何?

Dillinger.io 是一款具有雲端同步功能的優秀線上 Markdown 編輯器。但它不支援 Mermaid 圖表、KaTeX 數學公式或安全的 HTML 清理,並且由廣告支援。本工具增加了 Mermaid、LaTeX/KaTeX、DOMPurify 清理、基於 URL 的分享和離線能力。

與 StackEdit 相比如何?

StackEdit 是一款功能強大的 Markdown 編輯器,支援 KaTeX 和 Mermaid。主要取捨是:StackEdit 需要 Google 或 GitHub 帳號、在雲端儲存文件,介面也更複雜。本工具優先考慮簡潔性和隱私保護。

與 HackMD 相比如何?

HackMD 是為團隊設計的強大協作 Markdown 平台。但 HackMD 將所有文件儲存在自己的伺服器上(免費文件預設公開可存取),且需要註冊帳號。本工具適用於個人使用場景,透過 URL 實現快速、私密的分享。

與 Typora 相比如何?

Typora 是一款付費桌面 Markdown 編輯器($14.99),擁有獨特的無縫編輯模式。本工具基於瀏覽器,在任何作業系統上無需安裝即可使用,也不需要付費。

與 Obsidian 和 Notion 的 Markdown 功能相比如何?

Obsidian 需要安裝,有自己的 Markdown 方言。Notion 使用區塊式編輯器且需要帳號。如果你只需要在瀏覽器中快速預覽 Markdown,兩者都不是理想選擇。

與 Marked.js 即時示範相比如何?

Marked.js 示範是一個基礎的參考實作,沒有 Mermaid、KaTeX、語法高亮、工具列、匯出或分享功能。本工具在此基礎上提供了完整的寫作介面,包含上述所有功能。

能將 Markdown 匯出為 PDF 或 HTML 嗎?

可以。使用匯出 → 列印/儲存 PDF,將文件(含圖表、數學公式和高亮程式碼)渲染為 PDF。使用匯出 → 下載 .html,獲得內嵌樣式的獨立 HTML 檔案。也可以複製渲染後的 HTML 或富文字,貼到 Gmail、Google 文件或 Notion。

渲染後的 HTML 是否防範 XSS 攻擊?

是的。解析後,產生的 HTML 經 DOMPurify 清理,移除危險構造 — <script> 標籤、行內事件處理器、javascript: URL — 因此即使是來自不可信來源的 Markdown,預覽也是安全的。

能在不建立帳號的情況下分享 Markdown 文件嗎?

可以。點選分享,工具將整個文件編碼到 URL 中(經 LZ-string 壓縮),並將連結複製到剪貼板。任何開啟該連結的人都能在編輯器中直接載入該文件 — 無需伺服器、無需資料庫、無需帳號。

預覽面板與編輯器同步捲動嗎?

是的。編輯器和預覽面板實現雙向同步捲動 — 在編輯器中捲動,預覽跟隨;反之亦然。格式工具列支援一鍵插入粗體、斜體、刪除線、行內程式碼、標題、清單、引用、連結、圖片、表格和程式碼區塊。

能開啟已有的 .md 檔案嗎?

可以。點選開啟(或將檔案拖入編輯器),即可直接將 .md、.markdown 或 .txt 檔案載入到編輯器中。檔案由瀏覽器在本地端讀取 — 絕不上傳。載入後可編輯、預覽和匯出。

支援哪些 Markdown 功能?

解析器支援 CommonMark 及 GFM 擴充功能:標題、強調、粗體、刪除線、水平線、引用區塊、無序和有序清單、任務清單、管道符表格、帶高亮的程式碼區塊、行內程式碼、連結、圖片和原始 HTML。此外還支援:```mermaid 區塊中的 Mermaid 圖表、透過 KaTeX 的 $…$ 和 $$…$$ LaTeX 數學公式,以及註腳。HTML 經 DOMPurify 清理。

Related tools

檢視所有工具