A converter, not an editor
This Markdown to HTML converter takes Markdown you already have, from a README, a notes app, a chat answer or a .md file, and turns it into clean HTML you can paste into a website, a CMS, a newsletter template or a help center. You choose how the HTML should look: a fragment or a full page, heading IDs for links, readable or compact. The HTML source and a rendered preview sit side by side, so you can check both before you copy.
If you want to write Markdown from scratch, with a toolbar, keyboard shortcuts and a preview that scrolls along, use the Markdown editor instead. Both use the same parser, so the same Markdown gives the same elements and text in each; this page adds the output options below.
The options
- HTML fragment or full document. A fragment is only the content, from the first heading to the last paragraph. Use it when the HTML goes into an existing page or template. A full document adds the doctype, the html, head and body elements, a UTF-8 charset, a viewport tag for phones and a title. Turn on Basic styles to add a short style sheet that sets a readable line length, fonts and borders for tables and code; leave it off when your own CSS takes over.
- Heading IDs. Every heading gets an id attribute made from its text, so you can link straight to a section, like page.html#how-to-update, or build a table of contents. The rule is simple and always gives the same result: lowercase, remove characters other than letters, digits, hyphens and underscores, and replace spaces with hyphens. A repeated heading gets -1, -2 and so on, so no ID appears twice.
- Pretty or compact. Pretty puts each block on its own line and indents lists, quotes and tables by two spaces per level, which makes the HTML easy to read and edit. Compact removes the line breaks between blocks, so a document with short paragraphs fits on one line. Both show the same in a browser: under the CSS rules for white space, space between blocks that collapses away creates no box on the page. Line breaks inside a paragraph stay in both layouts, and code blocks are never touched: every space and line break inside them stays as it was.
The preview on this page uses the styles of this site, so it shows the structure: headings, lists, tables, code and links. Your own page will look the way your CSS says. Links in the preview open in a new tab.
Why raw HTML is escaped
Markdown lets you mix in raw HTML: under the CommonMark rules for raw HTML, a tag in the text is rendered without escaping. That is a risk when the Markdown comes from somewhere else: a <script> tag or an image with an onerror attribute would run code on the page where you paste the result. This converter never passes HTML from the input through. Every < in your text comes out as < and shows as a visible character, so the only tags in the output are the ones the converter writes itself. Links and images whose address starts with javascript:, vbscript:, file: or data: are written as plain text; images may still use data: addresses for PNG, GIF, JPEG and WebP pictures.
When your Markdown contains HTML tags, a note above the result says how many were escaped. If you need a tag such as a video embed, add it to the HTML after you copy it. To escape or unescape entities in other text, use the HTML entity converter.
What Markdown is supported
The converter follows the CommonMark 0.31.2 specification and adds four extensions of GitHub Flavored Markdown 0.29 (GFM).
| Markdown | HTML |
|---|---|
| # Heading to ###### Heading | <h1> to <h6> |
| **bold**, _italic_, ~~struck~~ | <strong>, <em>, <del> |
| - item, 1. item | <ul>, <ol> and <li> |
| - [ ] task, - [x] done | Disabled checkboxes in list items |
| | a | b | with a --- row | <table> with <thead>, <tbody> and align |
| ``` fenced code ``` | <pre><code class="language-js"> |
| [text](url),  | <a href>, <img src alt> |
| > quote, --- | <blockquote>, <hr /> |
Code blocks with a language name get a class like language-js, which syntax highlighters on your own site can pick up. The output has no syntax colors itself. Math, emoji shortcodes like :smile: and definition lists are not part of these specs and stay as plain text. Footnotes are not supported either: a mark like [^1] stays plain text, unless a line like [^1]: note gives it a note that is a single word or a web address. Markdown reads such a line as a link definition, so the mark becomes a link to the note and the line itself disappears.
The parser was written for this site and tested against the example files of both specifications. Of the 652 CommonMark examples, 576 give exactly the HTML the spec expects; most of the others contain raw HTML, which this converter escapes on purpose. The Markdown editor guide lists the results by section.
Tips for using the HTML
- When your CMS or email tool has both a visual editor and an HTML view, paste the fragment into the HTML view. In a visual editor the tags would show up as text.
- A full document from this tool has no lang attribute, because the converter cannot know the language of your text. Add one, like <html lang="en">. The WCAG guidance on page language explains that screen readers use it to load the right pronunciation rules.
- Check the word count of the finished text with the word counter, or compare two versions with text compare.
How to use the Markdown to HTML converter
- 1Paste your Markdown into the box, drop a .md file on it or press Open .md file.
- 2Pick HTML fragment or Full document, Pretty or Compact, and whether headings get IDs.
- 3Check the HTML source and the preview. On a phone, switch between them with HTML and Preview.
- 4Press Copy HTML, or Download .html to save the file.
Frequently asked questions
Is my Markdown uploaded?
No. The conversion runs in your browser with code that is part of this page, and nothing you paste or open is sent to a server. Copy link only stores the options, never your text.
Why does my HTML show up as text?
The converter escapes every HTML tag in your Markdown on purpose, so a <div> or <script> comes out as visible text instead of a real tag. That keeps the output safe to paste into a page even when the Markdown came from someone else. Write the formatting in Markdown instead, or add the tags to the result yourself.
What is the difference between a fragment and a full document?
A fragment is only the HTML for the content, starting with the first heading or paragraph, ready to paste into a CMS, a template or an email. A full document wraps it in doctype, html, head and body, with a title and, if you want, a small style sheet, so you can open the file in a browser as it is.
How are the heading IDs made?
From the heading text: it is lowercased, characters other than letters, digits, hyphens and underscores are removed, and spaces become hyphens. "What changed?" becomes what-changed. When two headings have the same text, the second gets -1, the third -2, so every ID is unique and you can link to #what-changed.
Does compact HTML look different in the browser?
No. Compact only removes the line breaks between blocks, such as between two paragraphs or list items, which a browser does not show. Line breaks inside a paragraph and every character in a code block stay as they are. Pretty adds indentation that a browser does not show either; it is just easier to read and edit.
Which Markdown features are supported?
CommonMark plus the GitHub Flavored Markdown (GFM) extensions for tables, task lists, strikethrough and links written as plain web addresses. Footnotes, math, emoji shortcodes and raw HTML are not supported. A footnote line such as [^1]: note is read as an ordinary link definition when the note is a single word or a web address, so a [^1] in the text then becomes a link to it.