Markdown Preview

Write markdown and see a live rendered preview side by side. Supports headers, bold, italic, links, images, code blocks, lists and more

Welcome to Markdown Preview

What is Markdown?

Markdown is a lightweight markup language for creating formatted text.

Key Features

  • Easy to read and write
  • Supports emphasis and strong text
  • Great for documentation

Code Example


const greeting = "Hello, World!";
console.log(greeting);

You can use inline code too.

Blockquotes are perfect for highlighting important information.

Visit MyKit.tools


Happy writing!

<h1>Welcome to Markdown Preview</h1>
<h2>What is Markdown?</h2>
Markdown is a lightweight <strong>markup language</strong> for creating formatted text.
<h3>Key Features</h3>
<ul><li>Easy to read and write</li></ul>
<ul><li>Supports <em>emphasis</em> and <strong>strong text</strong></li></ul>
<ul><li>Great for documentation</li></ul>
<h2>Code Example</h2>
<pre><code>
const greeting = "Hello, World!";
console.log(greeting);
</code></pre>
<p>You can use inline <code>code</code> too.</p>
<blockquote>Blockquotes are perfect for highlighting important information.</blockquote>
<p><a href="https://mykit.tools">Visit MyKit.tools</a></p>
<hr>
<p>Happy writing!</p>

Type on the Left, See HTML on the Right

Markdown was designed in 2004 by John Gruber as a way to write formatted text in a syntax that's still readable as plain text. The tool ships with a sample document covering headers, bold, italic, lists, and code blocks. Edit either side, see the rendering update on the next keystroke. Useful for rapidly drafting README files, blog posts, GitHub issues, and Notion-style notes without worrying about HTML.

The renderer here covers the core syntax: # through ###### for headings, **bold** and *italic*, [text](url) for links, ![alt](url) for images, > for blockquotes, --- for horizontal rules, ``` for fenced code blocks, and `inline` for inline code. Ordered and unordered lists are detected automatically. This matches the original Markdown spec closely; if you need GitHub-flavoured features like tables, task lists, strikethrough, or auto-linked URLs, write your source for [Markdown to HTML](/markdown-to-html) which uses a more complete parser.

GFM, CommonMark, and Why Your Output Differs

There is no single Markdown standard. The original Gruber spec was vague enough that every implementation made different choices, which is why the same input can render four different ways across GitHub, Reddit, Discord, and your static site generator. CommonMark (commonmark.org) is the closest thing to a precise spec; GitHub-Flavoured Markdown (GFM) extends CommonMark with tables, strikethrough, task lists, and autolinks. Most modern tools target GFM because that's what readers expect.

Quirks to watch for: a hard line break inside a paragraph is invisible in Markdown unless you end the line with two trailing spaces (which most editors strip on save) or a backslash. Tabs vs spaces inside list items behave differently across parsers. HTML embedded in Markdown is allowed by Gruber's spec but stripped by some sanitisers. If you're writing for a specific platform, render-test on that platform; this tool is a fast feedback loop, not a final preview.

Markdown Syntax Cheat Sheet

SyntaxRenders AsNotes
# Headingh1 elementOne # per heading level, up to ######
**bold**strong tagTwo asterisks, no spaces inside
*italic*em tagSingle asterisks, or _underscores_
[text](url)anchor linkNo space between ] and (
![alt](url)img elementSame syntax with leading exclamation
```code```pre code blockTriple backticks, language hint after the opening fence
> quoteblockquoteSpace after the >

Frequently Asked Questions

Why doesn't my line break work?

Markdown ignores single newlines by default and joins them into the same paragraph. To force a line break, end the line with two trailing spaces, or use a backslash, or use an empty line to start a new paragraph. This is the most common surprise for people coming from word processors.

Does this support GitHub Flavoured Markdown?

Partially. The renderer covers headings, emphasis, links, images, lists, code, blockquotes, and horizontal rules, which are the CommonMark core. Tables, task lists, strikethrough, and autolinking are not in this fast-preview mode. For full GFM rendering use the dedicated [Markdown to HTML](/markdown-to-html) tool, which uses a parser library.

Can I paste rich text and get Markdown?

No, this is one-way: Markdown to HTML. For HTML to Markdown, you need a different parser like Turndown. Pasting rich text from Word or Google Docs typically produces HTML on the clipboard; running it through Turndown gives you Markdown back, but the round-trip is lossy for complex formatting like nested tables or styled spans.

Is the source saved anywhere?

No. Both the source and the rendered HTML stay in your browser tab and disappear when you close it. If you want persistence, copy the rendered HTML or the Markdown source out before navigating away.

More tools β†’