Markdown to HTML Converter

About Markdown to HTML

Markdown to HTML converters take the lightweight plain-text format John Gruber introduced in 2004 and turn it into the equivalent HTML markup. This tool implements a CommonMark-aligned subset entirely in the browser so you can preview README files, blog posts, and documentation without copy-pasting into a third-party site.

The conversion runs through a single-pass tokenizer that recognises block constructs first and then applies inline rules within each block. Everything stays on the client, so you can drop in unpublished drafts, internal release notes, or proprietary technical documents without sending text to any server. The output HTML is plain semantic markup that drops cleanly into a CMS rich-text field, a static-site generator template, or an email composer.

How it works

The parser is a single-pass line scanner: it identifies block-level constructs (fenced code, headings, blockquotes, ordered and unordered lists, paragraphs), then applies inline patterns within each block.

For each line:
  if line starts ```           emit <pre><code> ... </code></pre>
  if /^#{1,6} /                 emit <hN> ... </hN>
  if /^> /                       emit <blockquote><p> ... </p></blockquote>
  if /^\d+\. / or /^[-*+] /     emit <ol> or <ul> with <li>
  else collect paragraph until blank line, emit <p> ... </p>
Inline:
  `code`, **bold**, _italic_, [text](url)

• Escape first, then transform: input is HTML-escaped before inline patterns are applied. This blocks script injection from pasted HTML.
• Supported: ATX headings, bold (** or __), italic (* or _), inline code, fenced code, links, blockquotes, OL, UL.
• Not supported: GFM tables, task lists, strikethrough, autolinks, footnotes, definition lists, math, raw HTML pass-through.

Worked example

Input markdown:

1. Source line: # Welcome
2. Match: ATX heading level 1.
3. Output: <h1>Welcome</h1>.
4. Source paragraph: This is **bold** and `code`.
5. Inline scan: **bold** matches, replaced with <strong>bold</strong>. Backtick pattern wraps code in <code>.
6. Output: <p>This is <strong>bold</strong> and <code>code</code>.</p>.
7. Source list: three lines starting with - .
8. Output: <ul><li>...</li><li>...</li><li>...</li></ul>.

Markdown flavors compared

Common mistakes

• Mixing inline asterisks and underscores incorrectly. __bold__ works, _*mixed*_ behavior varies between parsers. Stick to one style per project.
• Forgetting blank lines around blocks. A list with no blank line above can get absorbed into the preceding paragraph by some parsers. Always separate block constructs with a blank line.
• Indenting code blocks incorrectly. Triple-backtick fenced code is more reliable than 4-space indentation, especially inside list items where indentation is already used for nesting.
• Expecting GFM tables to work everywhere. Tables, task lists, and strikethrough are GFM extensions. CommonMark-only parsers (and this tool) render them as literal text.
• Pasting curly quotes from Word. Smart quotes (" ") break many inline emphasis rules. Convert to straight ASCII quotes first.
• Trusting raw HTML rendering for security. Most markdown engines (including this one's escape-first strategy) block HTML execution. For untrusted user input, sanitize the output HTML through DOMPurify before injecting it into a page.
• Relying on tight list spacing. A loose list (blank lines between items) gets wrapped paragraphs in many parsers; a tight list does not. Adding or removing one blank line can change vertical rhythm dramatically. Pick one style for the whole document.
• Forgetting the trailing space for hard breaks. A line break inside a paragraph requires two trailing spaces or a backslash at end of line in CommonMark. A single newline collapses to a space. This trips up writers used to plain-text editors.

Related tools and glossary

Frequently asked questions

Sources

• CommonMark (2014, current spec 0.31) A strongly defined, highly compatible specification of Markdown.
• GitHub (2024) GitHub Flavored Markdown Spec.
• Gruber, John (2004) Daring Fireball: Markdown, the original spec.
• Pandoc (2025) Pandoc User's Guide: Pandoc's Markdown.

Last updated 2026-05-28.