Developer Runs locally Ready to use Built-in examples No tracking

Markdown to HTML

Convert Markdown to HTML with both source and rendered preview. Headings, lists, tables, code blocks, links and images are supported, plus backslash escapes. Output is escaped with a link and image protocol whitelist.

Markdown expresses headings, lists, links and emphasis with a few symbols, which is why it dominates documentation, READMEs and technical writing — but a web page ultimately renders HTML. This tool converts Markdown source into HTML and shows the rendered preview alongside, ready to paste into a blog, a CMS template or a static site.

Safety is where converters of this kind go wrong most often: splicing user input straight into HTML invites XSS, so this tool escapes the content first and then emits tags from an allow-list, permitting only http, https and relative paths in links, with dangerous schemes such as javascript: degraded to plain text. Note also that Markdown dialects differ — tables, footnotes and formulas are supported to different degrees — so a migration should follow the target platform.

—

How to use

  1. Paste the Markdown source.
  2. Read the HTML and the rendered preview together.
  3. Check that links and images come through with a permitted scheme.
  4. Follow the target platform's dialect when migrating.

How it works

Supported syntax

Covers the common subset: # through ###### headings, **bold**, *italic*, ~~strikethrough~~, `inline code`, ``` fenced blocks, - unordered lists, 1. ordered lists, > quotes, --- rules, | tables (with :--- alignment), [text](link), ![alt](image), and backslash escapes (\* outputs a literal asterisk for "not italic" content).

Dual-output design

Conversion produces two results at once: HTML source (monospace, one-click copy into your project) and a rendered preview. Press convert after edits to refresh; the sample button fills in typical syntax.

The injection-safety mechanism

Safety has two layers: every text node is HTML-escaped (< > & quotes) first, then tags are generated from a whitelist — so <script> content appears only as text; link hrefs allow only http/https/relative paths, and javascript:-style protocols degrade to plain text.

Code example

JavaScript Converting with marked and DOMPurify 

import { marked } from 'marked';
import DOMPurify from 'dompurify';

// Convert to HTML first, then sanitize (order matters)
const html = DOMPurify.sanitize(marked.parse(md), {
  ALLOWED_URI_REGEXP: /^(?:https?|mailto):|^\//i,
});

document.querySelector('.preview').innerHTML = html;

Shell Converting on the command line 

# Pandoc: Markdown to an HTML fragment (-f gfm parses GitHub-flavored Markdown)
pandoc -f gfm -t html --no-highlight in.md -o out.html

# Python's markdown package (the standard library has no Markdown support)
python3 -m pip install markdown
python3 -c "import markdown; print(markdown.markdown(open('in.md', encoding='utf-8').read()))"

FAQ

Which Markdown syntax is supported?

The core set: six heading levels, paragraphs, bold/italic/strikethrough, inline and fenced code, ordered and unordered lists, quotes, rules, tables (left/center/right alignment), links, images and backslash escapes. Extensions like footnotes, task lists and definition lists render as plain text; nested lists flatten one level.

Any limits on image syntax?

Image URLs share the link whitelist: http, https and relative paths (/ or ./). ![img](javascript:alert(1)) produces no img tag — the text shows as-is, keeping dangerous protocols out of src. Query strings (?a=1&b=2) work normally.

Is the output HTML safe from XSS?

Yes. The tool escapes all input text first (< becomes &lt; and so on), then generates tags from a whitelist, so <script>alert(1)</script> only ever displays as text, never executes. The engine tests cover exactly this case.

Why are some links clickable and others not?

href allows only http://, https:// and relative paths (/, ./, #). javascript: and data: are classic XSS carriers — encountering them, the whole link degrades to plain text (original preserved), protecting pages that render untrusted Markdown.

How is table alignment written?

Colons in the separator row control alignment: |---| left, |:---:| center, |---:| right. Header cells get the matching text-align style; body rows align to the header's column count, and extra columns are truncated.

Does the preview match my real site?

The preview renders exactly the tool's output HTML — tag structure identical, though fonts and leading differ from your site's CSS. Copy the HTML into your project and your stylesheet decides the final look.

Do line breaks become <br>?

Single newlines within a paragraph become <br> (GitHub-style); blank lines separate paragraphs. Lists, quotes and code blocks follow their own rules: code blocks keep newlines verbatim, list items need no blank lines between them.

Does conversion run locally?

Yes. Parsing and rendering run entirely in the browser via the built-in engine — no server involved, works offline. Unpublished drafts are safe to paste.