Markdown Preview

When to use Markdown Preview

• Drafting README files: Write and preview a README without pushing to GitHub - verify heading hierarchy, code block rendering, and table formatting before committing.
• Preparing documentation: Draft Markdown docs and confirm the output renders correctly before pasting into a CMS, Notion, Confluence, or GitHub Wiki.
• Testing Markdown in design specs: Check how GFM tables and task lists render when using Markdown in design tool comments or project management tools.
• Learning Markdown syntax: Experiment with CommonMark and GFM syntax and immediately see the rendered result, which is faster than committing test files to a repository.

How Markdown is parsed and rendered to HTML in the browser

The Markdown Preview tool parses input using the CommonMark specification - the standardised, unambiguous Markdown dialect published at commonmark.org in 2014 and maintained by a working group that includes engineers from GitHub, Stack Overflow, and Reddit. CommonMark resolves the many ambiguities present in John Gruber's original 2004 Markdown syntax, defining exact rules for how edge cases such as nested emphasis, link references, and indented code blocks should behave.

On top of CommonMark, the tool applies GitHub Flavoured Markdown (GFM) extensions, which add syntax for fenced code blocks with language identifiers, tables using pipe notation, task list items (- [ ] / - [x]), strikethrough with double tildes (~~text~~), and autolinks for bare URLs. GFM is defined in the GitHub Flavoured Markdown Spec and is the dialect most developers encounter daily because it is the standard for GitHub READMEs, issues, and pull requests.

The preview pane renders the generated HTML into an iframe with a scoped stylesheet that applies sensible typographic defaults - heading hierarchy, code block monospace font, table borders, and blockquote indentation. The preview updates on every keystroke using a debounced input handler (150 ms delay) so rendering does not interfere with typing. All parsing and rendering happens in the browser; your Markdown content is never sent to a server.