Read beautiful Markdown files instantly in your browser — no installation, no internet required, no clutter. One HTML file. Drag, drop, done.
一個 HTML 檔案，直接開啟 Markdown。零依賴、零安裝、零廢話。拖拉即開，編輯即存。
Drag a .md file, watch it render beautifully. Edit in the slide-out panel, save back instantly.
拖入 Markdown 檔案，即時渲染。側邊欄編輯，按鍵就存。
Most Markdown viewers fall into two extremes: bloated editors (Typora, VS Code) that feel like overkill for just reading, or raw GitHub rendering that strips away the joy of beautiful typography. I built EdgeMD Viewer because I wanted a tool that lives in the sweet spot—a browser-based reader that:
- Loads instantly (single HTML file, no build process)
- Works offline (everything runs in your browser)
- Renders Markdown with gorgeous typography and spacing
- Lets you edit when inspiration strikes
- Saves changes back to your original file
Built with vibe-coding principles: AI-assisted UX iteration focused on getting the feeling right rather than over-engineering. The result is a tool that's small, fast, and genuinely fun to use.
Drag & Drop Opening — No file dialogs. Just drag a .md file onto the window, and it opens instantly. Beautiful rendering kicks in immediately.
Live Editor — A slide-out editor panel appears when you need it (Cmd+E). See your changes reflected in the reading view in real time. Keyboard shortcut to flip between reading and editing modes.
Save Back to Original — Uses the File System Access API to write changes directly back to your original .md file. No "export as..." dance. Press Cmd+S, done.
Export as Standalone HTML — Convert any Markdown file into a self-contained HTML document. Share it, archive it, email it—no dependencies needed to view it anywhere.
Zen Mode — Toolbar hides automatically during reading. Keyboard shortcuts (Cmd+H) to toggle. A truly distraction-free experience.
Just go to https://md-viewer-edge.web.app/ and drag a .md file into your browser. That's it.
git clone https://github.com/0xedgelessblade/edge-md-viewer.git
cd edge-md-viewer
open public/index.htmlNo build step. No dependencies. Just open the HTML file in your browser.
Your .md File
↓
[marked.js: Parse Markdown → HTML AST]
↓
[DOMPurify: Sanitize HTML, prevent XSS]
↓
[Beautiful Reading View: Render with stone palette, Noto Sans TC, 720px max-width]
↓
[File System Access API: Save changes back to disk]
Every piece of code runs in your browser. Nothing is sent to servers. Your files stay yours.
I'm @0xedgelessblade, someone who loves minimal tools and clean reading experiences. Most of the joy in building this came from working collaboratively with AI to iterate on the UX until it felt just right—focus on the feeling, not the feature count.
| Feature | EdgeMD Viewer | Typora | GitHub Gist | VS Code Preview |
|---|---|---|---|---|
| Dependencies | Zero | Heavy | None (web) | Heavy |
| Setup Time | 30 sec | 10 min | N/A | 5 min |
| Works Offline | Yes | Yes | No | Yes |
| Edit & Save | Yes (to file) | Yes | No | Yes (workspace) |
| Export HTML | Yes, standalone | Paid feature | Basic | Yes |
| Price | Free | $15–20 | Free | Free |
EdgeMD Viewer is designed to be verifiably private. Don't take our word for it — read the source code (it's one file) or check these facts:
Zero network requests. There is no fetch(), no XMLHttpRequest, no WebSocket, no sendBeacon(), no tracking pixels — nothing that sends data anywhere. Your Markdown content never leaves your browser.
CSP enforced. The Firebase deployment includes a strict Content-Security-Policy header with connect-src 'self', which means the browser itself blocks any outbound data requests — even if someone tried to inject a tracking script.
No cookies, no storage. EdgeMD doesn't use localStorage, sessionStorage, or cookies. When you close the tab, nothing remains.
No analytics. No Google Analytics, no Plausible, no Mixpanel, no fingerprinting. Zero telemetry.
Subresource Integrity. The two external libraries (marked.js and DOMPurify) are loaded from cdnjs with SRI hashes, ensuring they haven't been tampered with.
How to verify yourself: Open DevTools → Network tab → reload the page → drag in a file → watch. You'll see exactly 3 requests: index.html, marked.min.js, purify.min.js. Nothing else. Ever.
What is EdgeMD Viewer? A single HTML file that reads Markdown beautifully in your browser. No dependencies, no installation, no internet required.
Does it need a server? Nope. It's a static HTML file with embedded JavaScript. Drop it in any folder and open it in your browser. Works offline entirely.
Can I edit files with it? Yes. Press Cmd+E to open the editor, make changes, and press Cmd+S to save back to your original file. Uses the browser's File System Access API.
What Markdown features are supported? Everything in GitHub Flavored Markdown (GFM): headings, lists, code blocks, tables, strikethrough, task lists, footnotes, etc. We use marked.js for parsing.
Is it free? Yes, completely free and open source under the MIT license.
How does the save feature work? The File System Access API lets your browser write directly to files on your computer (with your permission). You grant access once, and EdgeMD remembers it for future saves.
Can I use it in production or share it with others? Yes. You can fork the repo, modify it, deploy it, or share the live URL. It's MIT licensed.
Does it support dark mode? The current release uses a light stone palette. Dark mode is on the roadmap.
大多數 Markdown 閱讀器要嘛是 超重的編輯器（Typora、VS Code），功能多到超過需要，要嘛是 裸露的 GitHub 渲染，少了排版的美感。我做 EdgeMD Viewer 是因為想要一個介於兩者之間的工具——一個 瀏覽器 Markdown 讀者，能夠：
- 秒開（單一 HTML 檔案，無編譯流程）
- 離線可用（所有程式碼都在你的瀏覽器執行）
- 用漂亮的排版和間距渲染 Markdown
- 需要時可以編輯
- 直接存回原始檔案
採用 vibe-coding 開發法：與 AI 協作迭代，重點是把感受調對，而非過度設計。結果是一個小巧、快速、真正好用的工具。
拖拉即開 — 不用檔案對話窗。直接把 .md 檔案拖進瀏覽器，立即開啟。漂亮的排版自動套用。
即時編輯 — 需要時按 Cmd+E 打開編輯面板。所有改動實時反映在閱讀視圖。按鍵在閱讀和編輯間切換。
存回原始檔案 — 用 File System Access API 直接把修改寫回你的 Markdown 檔案。沒有「另存新檔」的麻煩，按 Cmd+S 就完成。
匯出為獨立 HTML — 把任何 Markdown 檔案轉成自包含的 HTML 文件。分享、備份、寄信——不用任何依賴就能在任何地方檢視。
禪思模式 — 工具列在閱讀時自動隱藏。按 Cmd+H 切換。真正的無干擾閱讀體驗。
前往 **https://md-viewer-edge.web.app/**，把你的 .md 檔案拖進去。完成。
git clone https://github.com/0xedgelessblade/edge-md-viewer.git
cd edge-md-viewer
open public/index.html無編譯步驟。無依賴。直接在瀏覽器開啟 HTML 檔案。
你的 .md 檔案
↓
[marked.js：解析 Markdown → HTML 樹狀結構]
↓
[DOMPurify：清潔 HTML，防止 XSS 攻擊]
↓
[漂亮的閱讀視圖：用石灰調色盤、Noto Sans TC、720px 最大寬度渲染]
↓
[File System Access API：把改動存回磁碟]
每行程式碼都在 你的瀏覽器執行。沒有資料傳到伺服器。你的檔案完全屬於你。
我是 @0xedgelessblade，喜歡極簡工具和乾淨的閱讀體驗。這個專案最有趣的部分是和 AI 協作迭代，直到 UX 感覺恰到好處——重點是感受，不是功能清單。
| 功能 | EdgeMD Viewer | Typora | GitHub Gist | VS Code 預覽 |
|---|---|---|---|---|
| 依賴 | 零 | 沉重 | 無（網頁） | 沉重 |
| 設定時間 | 30 秒 | 10 分鐘 | 無 | 5 分鐘 |
| 離線可用 | 是 | 是 | 否 | 是 |
| 編輯並存存 | 是（檔案） | 是 | 否 | 是（工作區） |
| 匯出 HTML | 是，自包含 | 付費功能 | 基礎版 | 是 |
| 價格 | 免費 | $15–20 | 免費 | 免費 |
EdgeMD Viewer 的隱私是可驗證的。不需要相信我的話——自己讀原始碼（就一個檔案）或檢查以下事實：
零網路請求。 沒有 fetch()、沒有 XMLHttpRequest、沒有 WebSocket、沒有追蹤像素。你的 Markdown 內容永遠不會離開你的瀏覽器。
CSP 強制執行。 Firebase 部署包含嚴格的 Content-Security-Policy header，connect-src 'self' 代表瀏覽器本身就會阻擋任何對外的資料請求。
零 Cookie、零儲存。 不使用 localStorage、sessionStorage 或 Cookie。關掉分頁，什麼都不會留下。
零分析工具。 沒有 Google Analytics、沒有 Mixpanel、沒有指紋追蹤。零遙測。
自己驗證的方法： 打開 DevTools → Network 分頁 → 重新載入頁面 → 拖入檔案 → 觀察。你只會看到 3 個請求：index.html、marked.min.js、purify.min.js。沒有其他東西。永遠不會有。
EdgeMD Viewer 是什麼？ 一個 HTML 檔案，在瀏覽器裡漂亮地閱讀 Markdown。無依賴、無安裝、無網路需求。
需要伺服器嗎？ 不需要。這是一個靜態 HTML 檔案，內嵌 JavaScript。放在任何資料夾開啟即可。完全離線可用。
可以編輯檔案嗎？ 可以。按 Cmd+E 打開編輯器，做出改動，按 Cmd+S 存回原始檔案。用瀏覽器的 File System Access API。
支援什麼 Markdown 功能？ GitHub Flavored Markdown (GFM) 的全部內容：標題、清單、程式碼塊、表格、刪除線、任務清單、腳註等。我們用 marked.js 解析。
免費嗎？ 完全免費，MIT 授權的開源軟體。
存檔功能怎麼運作？ File System Access API 讓瀏覽器直接寫入你電腦上的檔案（需要你許可一次）。授予存取權後，EdgeMD 會記住設定，未來存檔無需重複授權。
能用在正式環境或分享給別人嗎？ 可以。你可以 fork 這個 repo、修改、部署或分享直連網址。MIT 授權。
支援深色模式嗎？ 目前版本採用淺色石灰調色盤。深色模式在開發計畫中。
edgemd-viewer/
├── README.md # You are here
├── LICENSE # MIT License
├── .gitignore # OS + editor + Firebase ignores
├── public/
│ ├── index.html # The entire app — single file, zero dependencies
│ └── 404.html # Firebase 404 page
├── assets/
│ ├── banner.svg # README hero banner
│ └── demo-screenshot.svg # Feature showcase screenshot
├── examples/
│ └── demo.md # Sample Markdown file to try it out
├── firebase.json # Firebase Hosting config (for live demo)
└── .firebaserc # Firebase project reference
MIT License — see LICENSE for details. Built by @0xedgelessblade.
⭐ If you find EdgeMD Viewer helpful, please give it a star on GitHub. It means the world.