📝

Markdown Editor

Write Markdown with a live-rendered preview.

🔒 Runs entirely in your browser — nothing is uploaded.

How Markdown Editor works

How does the markdown editor work?

Typing in the left textarea fires an @input handler that runs your text through marked.js (loaded from a CDN, version 12.0.2) and drops the resulting HTML straight into the preview pane on the right via Alpine's x-html binding. There's no server round-trip — parsing happens synchronously in the browser on every keystroke, so the preview updates in real time.

When would I use this?

It's handy for drafting a README, a changelog entry, or any formatted note where you want to see headings, lists, and code blocks rendered before pasting the source into GitHub, a wiki, or a CMS that accepts markdown.

Does my draft get saved anywhere?

No — the editor doesn't write to localStorage or anywhere else, so closing the tab or refreshing discards whatever you've typed and reloads the sample text. The only way to keep your work is the Copy markdown button, which copies the raw source (not the rendered HTML) to your clipboard.