About Markdown to HTML

Markdown is the lingua franca of developer writing — READMEs, docs sites, wikis, comments — precisely because it converts cleanly to HTML. This converter turns Markdown (CommonMark plus GitHub-flavored extensions like tables and strikethrough) into HTML you can paste into a CMS, an email template, or a static page. Conversion happens locally in your browser.

Markdown's history explains its quirks: the original 2004 spec was ambiguous enough that every implementation disagreed on edge cases (nested lists, emphasis inside words, lazy blockquotes). CommonMark standardized the grammar in 2014, and GitHub Flavored Markdown (GFM) layered tables, task lists, autolinks, and strikethrough on top. Knowing which dialect a renderer speaks is half of debugging any 'my Markdown looks wrong' issue.

How to use Markdown to HTML

  1. Paste or type Markdown in the input area (headings, **bold**, lists, links, etc.).
  2. Click Convert to get HTML output.
  3. Copy or download the HTML.

Example

Input

# Hello

**bold** and *italic*

Output

<h1>Hello</h1>
<p><strong>bold</strong> and <em>italic</em></p>

What maps to what

# Heading → <h1>; **bold** → <strong>; *italic* → <em>; [text](url) → <a href>; ![alt](src) → <img>; `code` → <code>; fenced blocks ``` → <pre><code> (with a language class for highlighters); > → <blockquote>; - lists → <ul><li>; 1. lists → <ol><li>; GFM tables → <table> — and a blank line separates paragraphs (<p>).

The subtleties: a single newline inside a paragraph is a soft break (rendered as a space in strict CommonMark — end a line with two spaces or use GFM hard-break mode for <br>); indented text (4 spaces) becomes a code block, the classic cause of accidentally monospaced paragraphs; and raw HTML passes through by default, which is a feature in trusted docs and an XSS hole in user content.

Security: never trust rendered Markdown from users

Because Markdown allows inline HTML, converting user input and inserting the result into a page unsanitized is an XSS vulnerability — <img src=x onerror=alert(1)> is valid Markdown-embedded HTML, and javascript: URLs work in links. Every platform that renders user Markdown (GitHub included) sanitizes the resulting HTML.

The rule: convert, then sanitize the HTML with an allowlist library (DOMPurify in JS) before inserting into the DOM — sanitizing the Markdown source instead of the output does not work, because the converter itself can construct dangerous HTML from innocent-looking input.

Dialect differences that bite in practice

  • Tables, strikethrough (~~), task lists (- [ ]) are GFM — plain CommonMark renderers drop them.
  • Line breaks: GitHub comments treat single newlines as <br>; README rendering and strict CommonMark do not.
  • Heading IDs/anchors are generated differently across renderers (github-slugger vs others) — deep links to headings can break when switching engines.
  • Nested lists need consistent indentation (2 vs 4 spaces disagreements between renderers are legendary).
  • Autolinking bare URLs is GFM; CommonMark requires <https://…> angle brackets.

Common errors and how to fix them

A paragraph renders as a code block

Cause: The line is indented 4+ spaces — indented-code-block syntax, usually from pasted text.

Fix: Remove leading indentation from prose; keep 4-space indentation only where you mean code.

Table syntax shows as literal pipes

Cause: The renderer is strict CommonMark (tables are a GFM extension), or the separator row (---|---) is malformed/missing.

Fix: Ensure a header row plus separator row with at least three dashes per column; verify the target platform supports GFM tables.

Single line breaks disappear

Cause: CommonMark treats a lone newline as a soft break (a space).

Fix: End lines with two trailing spaces for <br>, insert a blank line for a new paragraph, or enable the converter's hard-break option.

Numbered list restarts or renders as one item

Cause: Blank lines between items broke list continuity, or inconsistent indentation detached nested content.

Fix: Indent continuation content to align with the item text; avoid blank lines inside tight lists (or accept loose-list <p> wrapping).

Rendered HTML executes scripts / gets stripped by the CMS

Cause: Raw HTML in the source: dangerous when trusted blindly, and many CMSs strip it entirely on paste.

Fix: Sanitize with an allowlist (DOMPurify) when rendering user content; for CMS pasting, prefer pure-Markdown constructs over inline HTML.

Tips and best practices

  • Always add a language to fenced code blocks (```js) — syntax highlighters and screen readers both use it.
  • Use reference-style links ([text][1] with [1]: url at the bottom) in long documents — the prose stays readable and URLs update in one place.
  • Escape literal specials with a backslash: \* \_ \# — indispensable when writing about Markdown itself.
  • For email, inline the CSS after conversion; email clients ignore <style> blocks (and Outlook ignores most of everything).
  • Paste the generated HTML through the HTML to Text tool to sanity-check reading order and alt text — a quick accessibility smoke test.

Frequently asked questions

Which Markdown dialect does this support?
CommonMark plus the GitHub-flavored extensions people actually use: tables, strikethrough, autolinks, and fenced code blocks with language hints. If your target platform is strict CommonMark, avoid GFM-only constructs.
Is the generated HTML safe to embed directly?
For your own trusted content, yes. For anything user-generated, sanitize the HTML output first (e.g. DOMPurify) — Markdown legally embeds raw HTML, so unsanitized rendering is an XSS vector regardless of which converter you use.
Why don't my line breaks show up?
In CommonMark, a single newline is a soft break rendered as a space. Two trailing spaces produce <br>; a blank line starts a new paragraph. GitHub comments differ (they hard-break single newlines), which is why habits formed there mislead elsewhere.
How do I get syntax-highlighted code blocks?
The converter emits <pre><code class="language-js"> from ```js fences. Highlighting itself is a separate client library (Prism, highlight.js, Shiki) that targets those classes — include one on the destination page.
Can I convert HTML back to Markdown?
Not with this tool — the reverse direction is lossy and heuristic (Turndown is the usual JS library). Round-tripping generally degrades complex HTML; keep the Markdown as the source of truth.

Embed this tool

Add Markdown to HTML to your own site, blog post, or internal docs — free, no signup. The widget runs entirely in your visitors' browsers, same as it does here.