Markdown → HTML

Markdown converted to clean, semantic HTML. Free, no upload. 1 GB max · Up to 1 GB · Processed locally, never sent to a server.

Markdown is for writing, HTML is for publishing, and something has to bridge the two. The need is almost always a precise one: pasting an article into a publishing system that accepts nothing but HTML, producing a documentation page readable without installing a site generator, or checking what a readme file will look like before it goes online.

The tool takes the text typed into the field or imported from a .md file, hands it to the marked library, then displays the rendering just below. Two outputs are offered: a complete, self-contained HTML page to download, or the fragment on its own, copied to the clipboard and ready to paste into an existing template.

One point is worth knowing before you start. The HTML produced goes through a filter, for the preview as much as for the download. If your Markdown contains HTML tags written by hand, some of them will be kept and some removed. The exact list appears further down, along with the Markdown flavour that is recognised and the common syntaxes that are not part of it.

How to use it

  1. Type or import the Markdown Write straight into the field, paste your text, or use the import button to load a .md or .markdown file, whose content replaces whatever the field held.
  2. Convert to HTML The button loads marked on first use and shows the rendering under the field. The text stays editable: correct it and reconvert as many times as you need.
  3. Check the preview Headings, lists, tables and code blocks appear exactly as they will be produced. A heading left as plain text points to a hash sign that is not followed by a space.
  4. Download the complete page The file document.html stands on its own: doctype declaration, UTF-8 encoding, a language attribute, a mobile viewport tag and an embedded stylesheet. No external file is required.
  5. Or copy the fragment on its own The second button places the content on the clipboard with no header and no styling, the form most publishing systems expect.

The Markdown flavour that is recognised

marked applies by default the flavour known as GitHub Flavored Markdown. On top of the basic syntax — headings, bold, italic, nested lists, block quotes, links, images and horizontal rules — you get tables with per-column alignment, strikethrough between double tildes, task list checkboxes, and fenced code blocks delimited by three backticks. An address written in plain text becomes a link. The language named after the backticks ends up as a class on the code tag, with no syntax highlighting applied.

Three behaviours regularly take people by surprise. A single line break does not break the paragraph: two consecutive lines are joined, unless the first ends with two spaces. Headings are produced with no anchor identifier, so a table of contents written by hand finds none of its targets. And footnotes, definition lists and front matter blocks at the top of a file are not handled; the last of these comes out as a horizontal rule followed by a second-level heading.

The HTML you write inside your Markdown

Markdown syntax allows HTML tags to be inserted in the middle of the text, and marked lets them through untouched. A filter then steps in, before the preview as before the download, and always removes the same elements: scripts, inline frames, embedded objects, forms, noscript blocks and document head tags. Event attributes are stripped, as are links whose address begins with javascript:, data: or vbscript:, with the single exception of images encoded in base64.

Everything else is kept: a table written by hand, a collapsible details block, superscripts, abbreviations, containers with their classes and your images all cross the conversion unharmed. A video embedded through an inline frame will disappear, on the other hand; add the embed afterwards, from your publishing system.

The downloaded page and what is left to do

The file you get is sufficient in itself: it carries its own styling, calls for no external font and no external script, and opens offline. The presentation is plain: a 760-pixel column centred on the page, body text in Georgia, headings in Helvetica, code blocks on a light grey background, tables with hairline borders, images brought back to the width of the text.

Three touch-ups are left to you. The document title reads Document and the file is always called document.html: open it in an editor to change the title tag and rename it. The language attribute on the html element is set to fr, so change it to your own language code before publishing, for screen readers and search engines alike. Images keep the path you wrote; a relative path assumes the matching folder travels with the page, whereas a full address works as it stands.

Blog post, documentation, and what the tool does not do

For a blog post, use the button that copies the fragment: most publishing systems expect the content on its own and apply their own template, whereas pasting a complete page into them would produce one document nested inside another. For a note to hand over or to archive, the complete page is the better fit.

For a documentation site properly speaking, with navigation between pages and an automatic table of contents, a static site generator remains the right tool: here each file is converted separately and nothing links the pages together. The text you type never leaves the page, only the marked library being loaded from this site’s own files; the local history records that a conversion took place, along with the word count of the source text.

Frequently asked questions

Why do my line breaks disappear?

marked follows the original Markdown rule, under which a single line break does not break the paragraph. End the line with two spaces to force a break, or leave a blank line between the two.

Why is my code block not coloured?

The language named after the backticks becomes a class on the code tag, but no highlighting is applied. Add a syntax highlighting library to the final page if you want colour.

Why has my video embed disappeared?

Inline frames are among the elements the filter removes, along with scripts, embedded objects and forms. Publish the HTML without the video, then add the embed from your publishing tool.

Why do the links in my table of contents lead nowhere?

Headings are produced with no anchor identifier. Place an anchor in HTML yourself before each heading, or let your publishing system generate the identifiers at display time.

My front matter block ends up in the page. Is that normal?

Yes. A metadata block at the top of a file is not recognised as such: the rule above it becomes a horizontal line and the line that follows becomes a second-level heading. Remove that block before converting.

Can I process several .md files one after another?

Each import replaces the content of the field, so conversions happen one at a time. Since the field stays editable, you can also paste several documents into it end to end.

Can I use the HTML produced here for an email newsletter?

Not as it stands. The downloadable page carries its styling in a style block in the head, and most email clients either strip that block or ignore it, which is why email HTML is written with style attributes on the elements themselves and a table-based layout. Copy the fragment instead, then run it through a CSS inliner or paste it into the editor of your emailing tool.

Is there a live preview as I type?

No, the rendering appears each time you press the convert button rather than keystroke by keystroke. The field stays editable, so correcting the source and reconverting takes one click, and headings, lists, tables and code blocks show up in the preview exactly as they will be produced. A heading that stays plain text there points to a hash sign with no space after it.

Does my Markdown get sent to a server when I convert it?

No. The text typed or imported into the field never leaves the page; the only thing fetched is the marked library, loaded from this site’s own files on first use, after which conversion keeps working offline. The local history records that a conversion took place and the word count of the source text, never the text itself.

Similar tools

Discover other tools

Categories