Markdown Editor and Previewer

The editor is a split view with the source on one side and the result on the other.

1. Type or paste Markdown into the Markdown pane. Paste reads from the clipboard, Try it loads a short example and Clear empties the pane.
2. Watch the Preview pane update as you type. A heading, paragraph, list, table, link, image or code block shows as it would in a README.
3. Press Copy HTML to copy the rendered markup, with no page wrapper, for a CMS, template or email.
4. Press Download .md to save the source as document.md.
5. Press Download .html to save a standalone page called document.html, which includes a small built-in stylesheet.

Rendering uses the marked library in your browser, and nothing you write is uploaded. The editor does not keep a draft, so download the .md file before you close the tab.

The preview uses GitHub-flavoured Markdown with line breaks off. A blank line starts a new paragraph, and a single newline inside a paragraph is treated as a space.

Nest a list by indenting the child items under their parent, and two spaces are enough. To show a special character literally, put a backslash before it, as in \*not italic\*. A bare web address becomes a link by itself. A code block with a language gets a class such as language-js but is not colour-highlighted. Footnotes, definition lists, maths and diagrams are not supported, and neither are GitHub-only features such as @mentions and issue references.

Markdown allows raw HTML, so the preview and the exported HTML are cleaned before they are shown. Harmless tags such as kbd, sup, br and details pass through. These are removed:

• Script, style, iframe, object, embed, link, meta and form elements, plus input and button elements.
• Event handler attributes such as onclick.
• Link and image addresses that start with javascript:, data: or vbscript:. A link with such an address loses its target, and an image embedded as a data URI loses its source.

Two results surprise people. Task list items such as - [x] done are rendered as ordinary bullets without a checkbox, because the checkbox is an input element and is removed. The same clean-up applies to Copy HTML and Download .html, so what you see in the preview is what you export. Only the preview and the HTML are cleaned: Download .md saves your text exactly as you typed it. If you need checkboxes, a data-URI image or a form, add them in your publishing system after you paste.

Markdown is the common format of developer writing, so the editor doubles as a scratchpad for anything bound for a repository, wiki or web page.

• Draft a README or contributing guide and check that tables and code blocks render before you push.
• Write a pull request description or issue, then paste the source into GitHub, GitLab or Bitbucket.
• Prepare a post for a static site generator such as Hugo, Jekyll, Astro or Eleventy.
• Turn meeting notes into clean HTML for an email or an internal page.

Pass exported HTML through the HTML formatter to indent or minify it. The diff checker compares two versions of a document line by line, and the word counter reports length for articles with a word limit. For longer prose, the readability score checker shows the reading level of the draft.