What Is Markdown?
Markdown is a lightweight markup language for writing formatted text with plain characters. You write headings, lists, links, code blocks and tables, and a renderer turns them into HTML. It is used in README files, documentation, blogs, notes, tickets and static site generators because it is readable as plain text and easy to version control.
This Markdown Preview renders GitHub Flavored Markdown as you type and shows the sanitized HTML in a live preview. You can copy or download the generated HTML. Everything runs locally in your browser.
How to Use the Markdown Preview
- Paste or write Markdown in the input box.
- Review the live preview.
- Use the HTML output panel to copy or download the sanitized HTML.
The preview updates automatically after a short delay. If the Markdown contains raw HTML, it is sanitized before rendering so scripts and unsafe attributes are removed.
Common Markdown Syntax
# Heading 1
## Heading 2
**bold** and *italic*
- list item
- another item
[link](https://example.com)
`inline code`
```js
console.log("code block");
```Use a blank line between blocks. Indentation and line breaks are significant in Markdown, so paste text carefully when converting from another editor.
GitHub Flavored Markdown
The renderer supports GitHub Flavored Markdown (GFM), including tables, task lists, strikethrough and fenced code blocks. GFM is a superset of standard Markdown, so most documents written for GitHub, GitLab or documentation sites render as expected.
- Tables with header rows and alignment.
- Task lists with checkboxes.
- Fenced code blocks with optional language hints.
- Autolinks and strikethrough.
Markdown vs HTML
Markdown is easier to write and review than HTML, but it is less expressive. HTML gives you full control over layout, attributes and components. A common workflow is to write in Markdown, preview it, and copy the generated HTML into a CMS or static page. Keep the Markdown source under version control and regenerate the HTML when needed.
Sanitization and Security
Rendering Markdown that contains raw HTML can introduce security risks. This tool sanitizes the rendered HTML with DOMPurify before displaying it. That removes scripts, event handlers and other dangerous markup. Still, treat copied HTML as untrusted if it comes from an unknown source, and review it before publishing.
The preview is not a full browser sandbox for arbitrary HTML applications. It is a Markdown renderer with safe HTML output.
Common Uses
- Writing and previewing README files.
- Drafting documentation and release notes.
- Preparing blog posts and CMS content.
- Checking tables and code blocks before committing.
- Converting Markdown to HTML for emails or static pages.
Common Markdown Mistakes
Missing blank lines
Many Markdown renderers require a blank line between block elements. A heading immediately followed by a paragraph usually works, but lists, code blocks and blockquotes are more reliable with a blank line before and after.
Indentation in lists
Nested list items need consistent indentation. Mixing tabs and spaces can produce unexpected nesting or break the list. Use spaces and keep the same width for sibling items.
Unclosed code fences
A fenced code block starts and ends with three backticks. If the closing fence is missing, the rest of the document may be rendered as code. Check that every opening fence has a matching closing fence.
Links with spaces
URLs with spaces should be percent-encoded or wrapped in angle brackets. Raw spaces can break the link syntax. Prefer valid URLs and descriptive link text.
Markdown for Docs and Blogs
Keep one idea per section and use headings in order. Short paragraphs and lists are easier to scan than long walls of text. When publishing to a CMS, preview the rendered HTML and check tables, code blocks and links before saving. For README files, test the rendering on the target platform because different renderers support slightly different extensions.
Related Tools
Check document length with Word Counter or Character Counter, clean up pasted text with Text Minifier, or escape HTML manually with the HTML Entity Encoder / Decoder.