English

Markdown Preview — Live Render, Copy HTML

A live Markdown editor with sanitized HTML you can copy or save

Runs in your browser · nothing is uploaded

When on, your text is stored only in this browser (never sent to a server). Turning it off deletes the saved text.

Preview

Loading the preview engine…

The preview HTML is always sanitized: scripts, event attributes, javascript: links, iframes and forms are removed. If your text has image URLs, your browser fetches those images directly from their addresses.

What it is

Markdown Preview shows the rendered result next to your Markdown while you type. It is handy for checking a README, a blog draft, developer docs or meeting notes before you publish them. Headings, lists, quotes and code blocks work, and so do the GitHub Flavored Markdown extensions: tables, strikethrough and task lists. The output is always sanitized before it is displayed, so pasting text from an unknown source will not run any script.

How to use

  1. Type or paste Markdown into the left box. A short sample is there at first, and the Clear button empties it.
  2. The preview on the right refreshes a moment after you stop typing. Check table alignment and nested lists by eye.
  3. Press Copy HTML to put the sanitized HTML fragment on your clipboard, ready for an HTML-mode editor or an email template.
  4. Save .md downloads your original text. Save .html downloads a complete HTML document with a simple stylesheet. The file name is taken from your first level-one heading.
  5. To keep working later, turn on the draft option. The text is stored only in this browser.

How it works

  • Parser: marked (MIT license) converts text to HTML following the GFM specification. As in the standard, a single newline does not become a line break unless the line ends with two spaces or is followed by a blank line.
  • Sanitizing: DOMPurify (Apache-2.0 or MPL-2.0, used here under Apache-2.0) cleans the HTML before it is shown. Script, iframe, object, form and style tags, event attributes starting with on, style attributes, and links using javascript: or data: addresses are removed.
  • Links: remaining links open in a new tab with rel=“noopener noreferrer”.
  • Checkboxes: task list checkboxes are always disabled, so the preview is read-only.
  • Images: image addresses are left as written, so your browser requests them directly from their servers, and those servers can see that request.
  • Files: .md is your exact text in UTF-8. .html is a UTF-8 document with a lang attribute and a minimal stylesheet.

Examples

You type You get
**bold** bold
~~gone~~ gone
- [x] done a checked box followed by “done”
[link](https://example.com) a link that opens in a new tab
[click](javascript:alert(1)) the address is removed, only the text stays
<script>alert(1)</script> nothing runs

A table looks like this. The colons in the second row set the alignment.

| Item | Qty |
|:---|---:|
| Apple | 3 |

FAQ

Is my Markdown sent to a server?

No. Rendering and sanitizing both happen inside your browser, and nothing you type is uploaded. Text is only kept in this browser when you turn on the draft option, and turning it off deletes it. One caveat is that if your text points to an external image, your browser loads that image straight from its address.

Will a script tag in my text run?

No. The rendered HTML always goes through DOMPurify before it is shown, which removes script tags, event attributes such as onclick and onerror, javascript links, iframes, forms and style tags. The HTML you copy or download is the sanitized version.

How do I write a table or a task list?

For a table, separate columns with pipes and put a row of dashes under the header. A colon at the left end of that row means left aligned, and a colon at the right end means right aligned. For a task list, start a list item with - [ ] or - [x]. The preview shows read-only checkboxes. Both are GitHub Flavored Markdown features.

Will it look exactly like GitHub or my blog?

The syntax is interpreted the same way, but fonts, spacing and colors are decided by each service. Use this page to check that your Markdown parses the way you intended. The downloaded .html file only includes a simple readable stylesheet.

How long can the input be?

Up to 500,000 characters. Beyond that the preview pauses and shows a notice, so paste very long documents in sections.

Missing a tool?