Markdown Preview
Write and preview Markdown with GitHub Flavored Markdown (GFM) support. Tables, code blocks, strikethrough, and more.
100% private
Write Markdown in one pane and see the GitHub-flavoured rendering in the other — tables, fenced code blocks, task lists, and strikethrough. Copy the rendered HTML, or download your work as a .md or .html file. Useful for drafting README files, blog posts before pasting into a CMS, and any document where you want the Markdown source to be the canonical version. The parser runs on a Markdown library in your browser; drafts stay private to the page.
Markdown Source
Preview
Preview will appear here…
Markdown Quick Reference
# Heading 1H1## Heading 2H2**bold**Bold*italic*Italic`code`Inline code~~strike~~Strikethrough[text](url)LinkImage- itemUnordered list1. itemOrdered list> quoteBlockquote---Horizontal ruleRuns in your browser
Next steps
Code Formatter
RecommendedMake messy code readable — beautify or minify JS, HTML, CSS, YAML, and SQL.
Diff Checker
RecommendedSpot every change between two texts with side-by-side highlighting.
JSON Formatter
Instantly format, validate, or minify JSON — spot errors in seconds.
YAML Formatter
Format, validate, and convert YAML — with JSON ↔ YAML conversion.
Runs right inside your browser tab. No uploads. Your files stay private.
What Is Markdown?
Markdown is a lightweight markup language designed by John Gruber and Aaron Swartz in 2004 that converts plain text to HTML using punctuation conventions: pound signs for headings, asterisks or underscores for emphasis, backticks for code, and so on. It powers READMEs on GitHub, documentation sites built with Docusaurus or MkDocs, static blog generators like Hugo, and the issue trackers of nearly every modern dev platform.
This previewer is built on marked, a fast, spec-compliant Markdown parser written in JavaScript. We configure it with gfm: true and breaks: true so it follows the GitHub Flavored Markdown extensions (tables, task lists, autolinks, strikethrough, fenced code blocks) and treats single newlines as line breaks the way GitHub comment fields do. The parser turns your input into an HTML string that React inserts into the preview pane.
Conversion runs on every keystroke through a useMemo hook, so what you see in the preview always matches the latest source. Marked is fast enough that documents in the tens of thousands of words still parse in a few milliseconds; for very long documents you may notice slight typing latency because the entire string is reparsed each time.
Be aware of a security caveat: marked produces raw HTML, and we render it through dangerouslySetInnerHTML for fidelity. That means script tags or onerror handlers in your Markdown could execute. This is fine for content you wrote yourself, but if you ever paste Markdown from an untrusted source you should sanitize the output with DOMPurify before rendering. The exported .html file inherits the same caveat — check it before publishing.
GFM tables expect a header row, a divider row of dashes, and pipe-separated cells; uneven columns silently misalign rather than erroring. Code fences accept an optional language tag (```js) but this previewer does not currently apply syntax highlighting. The exported HTML uses minimal inline styles for legibility, not the GitHub theme — drop in a stylesheet like github-markdown-css if you want pixel-perfect parity.
Statistics shown above the editor (words, lines, characters) are computed from the raw Markdown source, not the rendered HTML. The word count splits on whitespace via a regex (split(/\s+/)), so it counts "Hello, world!" as two words. Character count includes Markdown syntax characters, which can be useful when targeting platforms with character limits like GitHub commit messages or Twitter.
Everything happens in your browser. The parser bundle, your input, and the rendered HTML never leave the page; closing the tab discards them. There is no autosave, so if you are drafting something important, copy it into a file or use the Save .md button periodically.
Common Use Cases
01
Drafting README files
Preview heading hierarchy, badge layout, and code-block formatting before pushing to GitHub or GitLab.
02
Writing documentation
Build technical docs and API guides with live feedback, then export the HTML for static site generators.
03
Composing blog posts
Write in Markdown, see the rendered output, then paste either the source or HTML into your CMS of choice.
04
Creating issue templates
Test how task lists, tables, and code blocks will look in GitHub issues and pull request descriptions.
Frequently Asked Questions
GFM is GitHub's superset of CommonMark. It adds tables, fenced code blocks, autolinks, strikethrough using double tildes, task lists using square brackets, and treats line breaks more loosely than the original spec. Most modern Markdown tooling supports it.
This previewer parses Markdown to HTML but does not load a syntax-highlighting library to keep the bundle small. Code blocks render with monospace formatting and a language class, so adding Prism.js or highlight.js to your output styles will color them correctly.
Yes. Save .md downloads the source, and Save .html downloads a self-contained file with minimal default styles. Drop github-markdown-css or your own stylesheet between the head tags to match a particular design system.
No. The marked parser runs in your browser, and the rendered HTML is inserted directly into the preview pane. Nothing is uploaded, logged, or persisted between sessions.
Marked outputs raw HTML by design and we render it without sanitization. Markdown you author yourself is fine, but content from untrusted sources can contain script tags or onerror handlers — sanitize with DOMPurify before reusing in production.
GitHub adds custom rules on top of GFM (emoji shortcodes, autolinked references, mentions, theme-aware styling, and Mermaid diagrams). This previewer covers the standard GFM grammar but not the GitHub-specific extras.
Not by default. KaTeX or MathJax can be added on top of the rendered HTML, but vanilla Markdown has no math syntax — GitHub recently added dollar-delimited LaTeX, which is not part of CommonMark or GFM proper.
It trims leading and trailing whitespace, then splits on one or more whitespace characters with a regex. Punctuation attached to words is counted as part of those words, so it is a heuristic — not the same algorithm Microsoft Word uses.
No. This is a one-way Markdown-to-HTML preview, not an HTML-to-Markdown converter. For the reverse direction, tools like Turndown or Pandoc are appropriate.
Yes. Once the page loads, the marked bundle is in memory and parsing requires no network access. The site works as a Progressive Web App on supported browsers.
Advertisement
What's next?