Markdown → HTML Converter

Overview

Converts Markdown to clean HTML with a live three-pane view: the Markdown source, the generated HTML markup, and a rendered preview of both. Headings, bold, italic, strikethrough, inline code, fenced code blocks, blockquotes, bullet and numbered lists, links, images, tables and horizontal rules are supported, and raw HTML in the input is escaped rather than executed.

How It Works

Type or paste Markdown into the left pane. The HTML output pane updates on every keystroke, and the rendered preview underneath shows exactly how the markup will look in a browser. Copy the HTML with one button or Download it as document.html; Clear empties the input. The default input is a small sample document containing a heading, emphasis, a list, a blockquote and a fenced JavaScript block, so the supported syntax is visible before you type anything.

Step-by-Step Usage Guide

1. Paste your Markdown into the left input pane.
2. Read the raw HTML in the right pane; it updates live with every edit.
3. Check the rendered preview to confirm the structure looks right.
4. Click Copy HTML and paste it wherever the raw markup is needed — a CMS field, an email template or a static page.

Technical Specifications & Standards

The converter is a block-level parser, and its order of operations is the security story. Fenced code blocks (backtick or tilde fences, with an optional language tag) are lifted out first so nothing inside them is treated as a heading, list or emphasis. The rest is processed line by line into headings (ATX # prefixes), horizontal rules, blockquotes (converted recursively), bullet lists (-, * or +), numbered lists (1. or 1), wrapped in <ol> with a start attribute when the first number is not 1), GFM pipe tables with column alignment, and paragraphs. Inside each block, code spans are set aside, ampersands and angle brackets are escaped — so any HTML you paste, including a script tag, renders as visible text instead of executing — and then images, links, **bold** or __bold__, *italic* or _italic_ (underscores inside words are left alone) and ~~strikethrough~~ are applied. One honest gap to plan around: nested lists are not supported, so indented bullets are flattened into the same list. Link and image URLs are filtered: only http, https, mailto, tel, relative and fragment links (and http(s) or base64 png, jpeg, gif and webp images) are kept, and a javascript: or other unsafe scheme leaves the Markdown as literal text.

Targeted Use Cases

• Turning a README section into HTML for a landing page or email that cannot render Markdown.
• Escaping and converting a blog draft when a CMS accepts only HTML.
• Previewing what pasted HTML inside Markdown will look like once escaped.
• Producing semantic markup (h1-h6, strong, em, blockquote) from a plain-text outline.

Notes & Gotchas

• Keep each list item on its own line starting with -, *, + or a number; a blank line between items ends the list and starts a new one.
• Do not expect nested lists — indented items are flattened into the parent list, so restructure them in the HTML after copying if you need nesting.
• Remember raw HTML is escaped, not stripped: script tags will show up as visible text, which is safe but noisy — remove them from the source instead.
• Use fenced code blocks for anything containing asterisks or underscores so emphasis rules do not fire inside it.

Frequently Asked Questions