Write Markdown, see a live HTML preview instantly. GitHub-compatible (GFM) tables, task lists, code blocks, links, and image support — no install, no sign-up, runs entirely in your browser.
💾 Your draft is auto-saved in this browser — close the tab and come back later to pick up right where you left off.
Quick answer
Markdown previewing means seeing plain-text markers like "# heading", "**bold**", and "- list" rendered as formatted HTML the instant you type them. Type your markdown into this tool (or upload a .md file), see the preview on the right, then copy the HTML or download it as .md/.html — nothing is ever sent to a server.
15+Markdown elements supported
0External libraries
InstantLive preview delay
100%Client-side processing
⚙️ Accuracy & scope note: This tool supports the most common Markdown and GitHub Flavored Markdown (GFM) elements: headings, bold/italic, strikethrough, lists, task lists, inline code/code blocks (with syntax highlighting for JS, TypeScript, Python, Bash, HTML, CSS, JSON, SQL, YAML, Java, Go, and C/C++), blockquotes, links, images, horizontal rules, tables, footnotes ([^1]), and LaTeX-style math ($inline$ and $$block$$, with fractions, sub/superscripts, and Greek letters). Embedded diagrams (Mermaid) and YAML front matter are out of scope. No text is ever sent to a server — all conversion and preview happen in your browser with JavaScript.
A full explanation of Markdown syntax — from headings to tables, task lists to code blocks — plus how it differs from GitHub Flavored Markdown (GFM).
Markdown is a lightweight markup language designed by John Gruber in 2004 that lets you format plain text with simple markers. The goal is text that is both readable as plain text and automatically convertible into clean HTML. Today it's used everywhere from GitHub README files to blog posts, technical documentation to note-taking. This tool converts and previews the markdown you type into HTML instantly, with no setup required.
What are the basic Markdown elements?
Quick answerThe core elements of Markdown are: # heading (levels 1–6), **bold** and *italic* text, - list items, `inline code` and ```code block```, > blockquote, [text](url) link,  image, and --- horizontal rule. All of these are supported in this tool and can be inserted with one click from the toolbar buttons.
Headings — the number of # at the start of a line sets the heading level (# = H1, ## = H2…).
Emphasis — single asterisk/underscore for italic, double asterisk/underscore for bold, double tilde (~~) for strikethrough.
Lists — "-", "*", or "+" for an unordered list; "1." for an ordered list; "- [ ]"/"- [x]" for a task list.
Code — a single backtick for inline code, triple backticks (```) for a multi-line code block.
How do you make a table in Markdown (GFM)?
Quick answerA GFM table has three parts: a header row (| Name | Age |), a separator row (| --- | --- |), and data rows. The position of the colon in the separator row controls alignment: :--- left, :---: center, ---: right. See a live example in the table below.
Example: markdown source → preview result
What you write
What you see
# Heading
Large H1 heading
**important**
important (bold)
- [x] done
☑ checked task box
| A | B |\n| --- | --- |\n| 1 | 2 |
2-column formatted table
What's the difference between Markdown and HTML?
Quick answerHTML is a tag-based markup language that browsers interpret directly, and it's relatively tedious to write and read. Markdown is a plain-text-like shorthand language that's fast to write, and a converter like this one turns it into valid HTML automatically. You can think of Markdown as the "source" and HTML as the "generated output."
Markdown syntax reference table
A citable quick reference: basic syntax and GitHub Flavored Markdown (GFM) extras.
Basic Markdown syntax
Syntax
Description
# Heading … ###### Heading
Heading levels 1–6
**bold** or __bold__
Bold text
*italic* or _italic_
Italic text
`code`
Inline code
> quote
Blockquote
- item / 1. item
Unordered / ordered list
[text](url)
Link
Image
---
Horizontal rule
Source: CommonMark specification (based on the original Markdown syntax).
Inline / block LaTeX-style math (this tool's own extension, not GFM)
www.site.com / https://…
Autolink detection (use explicit [text](url) syntax in this tool)
Source: GitHub Flavored Markdown Spec. Used in GitHub README files, issues, and pull request descriptions.
Markdown terms glossary
Short definitions of the core concepts used in Markdown and GFM.
Markdown (MD)A lightweight markup language that formats plain text with simple markers and converts to HTML.
GFMGitHub Flavored Markdown — GitHub's variant that adds tables, task lists, and strikethrough text.
Fenced code blockA multi-line code region opened and closed with triple backticks (```), where no formatting is applied.
Inline codeA short code snippet wrapped in a single backtick, within the flow of a paragraph.
Task listA list written as "- [ ]" / "- [x]", rendered as a clickable checkbox on GitHub.
Front matterA YAML metadata block added to the top of a markdown file, delimited by ---; out of scope for this tool.
Escape character (\)Placed before a markdown character to show it as plain text instead of applying formatting (e.g. \*).
Heading anchor (slug)A short auto-generated id derived from each heading, used to link directly to that section.
CommonMarkThe community-agreed formal specification that resolves Markdown's ambiguities.
HTML injection protectionRaw input is escaped before formatting is applied, preventing malicious code from executing.
LaTeX mathA notation for writing mathematical expressions (fractions, exponents, Greek letters). This tool renders it from $..$ / $$..$$ markers with no external library.
In-depth guides
Detailed answers to the most common Markdown questions.
How to make a table in Markdown (step by step)
A GFM table has three row blocks: a header row, a separator row, and data rows. Each cell is separated by a vertical bar (|). Example: below a row like | Product | Price |, add | --- | --- |, then add data rows like | Item | 10 |. The number of columns must match on every row.
For alignment, place a colon before/after the dash in the separator row: :--- aligns left, ---: aligns right, :---: aligns center. The "⬚ Table" button in this page's toolbar inserts a ready-made table skeleton — you just fill in the cells.
How to write a GitHub README.md
A good README typically includes these sections: the project name and a short description (H1 heading), installation steps (numbered list), a usage example (code block), features (bullet list), and license information. Using # for headings and triple backticks (```) for code samples gives you automatic syntax highlighting on GitHub.
Click the "README" template chip above to load a ready-made skeleton in this structure, edit it for your project, check the HTML preview, and download it as .md when you're done.
Markdown or Word? When should you use which?
Markdown is ideal for technical documentation, README files, blog posts, wiki pages, and version-controlled (Git) text — because it's plain text, diffable, and tool-independent. Word/Google Docs is a better fit when you need complex page layout, shared formatting (fonts, margins), or formal documents.
Before sharing markdown, preview it with this tool to make sure the formatting looks the way you expect, then export it directly as HTML and paste it into a web page or CMS if needed.
Add this previewer to your site (embed code)
Embed the markdown previewer on your own website for free. Copy the code below into your HTML — the tool runs in a simplified view and links back to this page as its source.
The embedded tool has a fixed layout; you can adjust the height value to fit your site. No ads or personal data, runs entirely client-side.
Frequently asked questions
How do you write Markdown?
Markdown lets you format plain text with simple markers: a # at the start of a line for a heading, **text** for bold, *text* for italic, a - at the start of a line for a list item, and [text](url) for a link. No special editor is required — you can write it in any plain text file and save it with a .md extension. Typing into the editor on this page shows the result instantly in the right-hand panel.
How do I preview an MD file?
Paste its contents into the editor on this page, or use the "Upload file" button to select it directly from your computer. The file is read automatically and displayed as formatted HTML in the right-hand panel; no upload or server processing is required, everything runs in your browser.
How do you make a table in Markdown?
In GFM table syntax, the header row is separated by |, followed by a separator row like | --- | --- |, then the data rows. A colon (:) in the separator row controls cell alignment. The "⬚ Table" button in the toolbar inserts a ready-made skeleton.
What is GitHub Flavored Markdown (GFM) syntax?
GitHub Flavored Markdown (GFM) is GitHub's variant of Markdown, adding tables, task lists (- [ ]), strikethrough text (~~text~~), and enhanced inline/code block support on top of standard Markdown. README files, issues, and pull requests are all written in GFM.
How do you convert Markdown to HTML?
Type your markdown into the editor on this page; you can copy the source of the HTML preview that appears instantly on the right with "Copy HTML", or save it as a complete .html file with "Download .html". The conversion happens entirely in your browser, with no data sent to a server.
What's the best online Markdown editor?
A good online markdown editor should offer instant preview, GFM table/task list support, HTML/MD export, and privacy. This tool meets all four: nothing you type is sent to a server, everything happens in your browser, and no account or sign-up is required.
How do you write a task list (checkbox) in Markdown?
Write "- [ ] Task to do" at the start of a line; for a completed task, use "- [x] Done". On this page you can click the box in the preview to toggle its state and see the updated markdown source in the editor.
How do I download or export a Markdown file?
You can download the editor's content as original Markdown (.md) or as formatted HTML (.html); the relevant buttons are below the tool panel. You can also use "Copy link" to share your content with others via a URL.
How do you write a footnote in Markdown?
Place a reference like [^1] in the text, and define it anywhere on the page as [^1]: explanation. The label can be a word instead of a number (e.g. [^source]). This tool numbers footnotes automatically in order of appearance, collects them in a "Footnotes" section below the preview, and links each reference to its note and back again. Ideal for citing sources in academic writing and blog posts.
Does the code block support syntax highlighting?
Yes. If you add a language tag to a fenced code block (```js, ```ts, ```python, ```bash, ```html, ```css, ```json, ```sql, ```yaml, ```java, ```go, ```c), keywords, string values, numbers, comments, and function names are highlighted with color. Highlighting is done entirely in your browser without an external library, and it adapts to dark mode.
Does this tool support LaTeX math notation?
Yes. Wrap an expression in single dollar signs for inline math, like $x^2 + y^2 = z^2$, or in double dollar signs on their own lines for a centered display block, like $$E = mc^2$$. Superscripts (^), subscripts (_), fractions (\frac{a}{b}), square roots (\sqrt{x}), and common Greek letters/operators (\alpha, \pi, \sum, \leq, \infty) are supported. Rendering happens entirely in your browser — no KaTeX or MathJax download required — and it can be switched off with the "∑ Math (LaTeX)" toggle above the editor if you need a literal dollar sign to stay as plain text.
How do I save Markdown as a PDF?
Click the "🖨️ Print / PDF" button below the tool panel; your browser's print dialog opens, and choosing "Save as PDF" as the destination downloads the formatted preview as a PDF file. The editor and interface elements are hidden in the output — only the rendered document appears.
Methodology & sources
ToolPico's Markdown Previewer is a free, independent tool. The parsing engine works in two passes with no external library: line-based block detection (headings, lists, blockquotes, code blocks, tables) followed by inline formatting (bold, italic, code, links, images).
Sources: CommonMark Specification · GitHub Flavored Markdown (GFM) Specification. Last updated: July 19, 2026.
Results cover the most common markdown/GFM elements; extended syntax such as LaTeX math and embedded diagrams is out of scope.