Real-time preview
The right pane updates on every keystroke using marked for Markdown parsing and highlight.js for code block syntax coloring.
Tool
Open source
React 18
md-fun
A browser-based Markdown editor with real-time preview. Type on the left, see formatted output on the right, save or load local files, and keep everything in your browser.
01 · Why it exists
Writing tools should not need a server.
Most Markdown editors are either desktop apps with heavyweight installs or cloud tools that require an account and send your content to a server. md-fun is neither. Open the URL, write, close it, and your draft is still there when you come back.
It is built for quick README drafts, notes, issue writeups, and lightweight technical writing where the tool should get out of the way.
Core behavior
The useful pieces are deliberately small.
Local file workflow
Export your content as a .md file or load a Markdown file from disk. No upload
endpoint is involved.
Safer rendering
Rendered HTML passes through DOMPurify before touching the DOM, including content loaded from local files.
02 · Implementation
Four focused libraries, no backend.
| Library | What it does |
|---|---|
marked |
Parses Markdown source into HTML, including common GitHub-flavored Markdown patterns. |
marked-highlight |
Connects fenced code blocks to the syntax highlighter during rendering. |
highlight.js |
Applies language-aware token classification for code examples. |
DOMPurify |
Sanitizes generated HTML before it is written into the preview pane. |
03 · Privacy and safety
Nothing leaves the browser.
No account
There is no login, user model, sync service, or remote document store.
Local drafts
Draft content is stored in localStorage. Clearing site data resets the editor.
Sanitized output
Markdown can produce HTML, so preview output is sanitized before it reaches the DOM.
Try it in the browser.
Open the editor, paste some Markdown, and close the tab when you are done. No setup needed.