Markdown Live Preview
Lightweight Markdown rendering: headings/bold-italic/code/lists/quotes/links/images/hr/tables.
Output is escaped HTML to prevent injection; supports headings, bold/italic, inline code, code blocks, lists, quotes, links, images, horizontal rules and tables.
Markdown live preview: the supported subset and why output is escaped
Markdown has no single standard implementation
Markdown began as a Perl script by John Gruber with a prose specification, so different implementations (GitHub, CommonMark, various editors) behave differently in detail. Later CommonMark tried to pin down a strict spec, and GitHub extended it into GFM (GitHub Flavored Markdown).
So the same Markdown file can render differently on different platforms. This tool implements a subset of common syntax — positioned as a quick preview, not a full renderer.
Supported syntax
| Syntax | How to write it |
|---|---|
| Heading | # through ###### at line start |
| Bold / italic | **bold**, *italic* |
| Inline code | wrapped in backticks |
| Code block | triple-backtick fence (or indentation) |
| Unordered / ordered list | - * + or 1. |
| Quote | > at line start |
| Link and image | [text](url),  |
| Horizontal rule | --- or *** |
| Table | pipe-separated, alignment row on the second line |
Usually unsupported or different
| Feature | Note |
|---|---|
| Raw HTML passthrough | this tool escapes the output, so writing a tag like <script> shows as text, not as an element. GitHub differs (it allows limited HTML) |
| Task lists | - [ ] checkboxes are a GFM extension; a subset usually treats them as a plain list |
| Strikethrough | ~~text~~ is a GFM extension |
| Footnotes | syntax varies by platform; not core |
| Autolinks | a bare URL becoming a link is GFM behaviour; standard Markdown does not |
| Nested list depth | a subset may support only limited nesting |
| Line-break behaviour | a hard break needs two trailing spaces or a backslash in standard Markdown; GFM breaks on a single newline. A common cross-platform surprise |
The line-break row causes the most confusion: in GitHub two adjacent plain lines show as two lines, while standard Markdown merges them into one paragraph. If a preview elsewhere looks wrong, check this first.
Why the output is escaped
The tool states plainly "output is escaped HTML to prevent injection". This design matters: if Markdown allowed raw HTML passthrough, then a tag like <script> would execute in the browser — the root of almost every Markdown rendering vulnerability (user-submitted content run as code).
Three layers of protection, increasing in safety:
| Approach | Safety |
|---|---|
| Allow HTML passthrough | most dangerous, equivalent to opening XSS |
| Escape all HTML (this tool) | safe, but users cannot insert custom HTML |
| Allowlist sanitize (e.g. DOMPurify) | allows some HTML and stays safe, by sanitizing after render |
So when rendering user-submitted Markdown in your own project, always escape or allowlist-sanitize; never insert the rendered result into the DOM directly. The consequence of such a flaw is an attacker running arbitrary scripts on your page and reading user data.
How links and images actually behave
- An image with a relative path will not show (no base URL in the preview); use a full URL or a data URI.
- Clicking a link tries to navigate the current page and may leave the preview. Note that, or record links as plain text to verify later.
- A table needs a strict alignment row (the
|---|on the second line). When column counts mismatch the table may not render and shows as plain text — the common reason a "table did not work".
How the tool works
Paste Markdown source, hit render, see the result below. Good for quickly checking whether a README, doc or note's formatting is as intended, and whether tables and code blocks are written correctly. Everything renders locally; document content is not uploaded — necessary when the document is internal. Before publishing, preview once on the target platform too, since extension support varies.
FAQ
Why do links do nothing or turn to #?
To prevent XSS, links get rel="noopener"; dangerous links starting with javascript: are replaced with #.