Markdown Preview
Live Markdown preview with tables, code blocks and blockquotes; raw HTML is always escaped — paste safely.
>_ USAGE GUIDE
Write Markdown on the left and watch the live rendered preview on the right: headings, lists, tables, code blocks, quotes, and images all render as you type — so a table's alignment, a nested list's levels, or a code fence's behavior is verified the moment it is written. Ideal while drafting blog posts, README files, and notes.
- Paste or write Markdown: rendering updates on every keystroke
- Check the tricky parts: tables, nested lists, and fenced code are where formatting most often goes wrong
- Fix and confirm: adjust the source until the preview matches your intent
Safety is handled strictly: raw HTML is always escaped — even a pasted <script> renders as visible text and never executes. The same page doubles as a writing scratchpad: draft release notes or issue descriptions here, confirm the tables and code fences render correctly, then paste the final text wherever it is published. Rendering runs entirely locally in your browser.
>_ FAQ
Q1 · How do I write a Markdown table?
Split columns with pipes and define alignment on the second line:
``markdown
| Name | Age |
|:-----|----:|
| John | 25 |
`
The colons on the divider row set alignment: :--- left, :---: center, ---: right. Classic traps: the divider row cannot be omitted, and a literal pipe inside a cell must be escaped as \|`. Paste the table here and any misalignment shows immediately.
Q2 · How do I get syntax highlighting in a code block?
Wrap the code in triple backticks and name the language on the opening fence: start with ``js and close with ``. Renderers only colorize code when the language is declared (js, python, go, and so on). This tool displays code faithfully with escaping; platforms that support highlighting, such as GitHub, will render the colors.
Q3 · Why did my HTML tags show up as plain text?
This tool deliberately escapes all raw HTML — a security decision. Pasted documents can contain malicious scripts, and escaping renders them inert. Most blog platforms apply the same policy. If you genuinely need embedded HTML, use the platform's sanctioned components or embed syntax instead.
Q4 · How does Markdown relate to HTML?
Markdown is an easy-to-write, easy-to-read markup syntax that a renderer translates into HTML. It covers everyday formatting — headings, lists, emphasis — while complex layouts still require HTML/CSS. The usual pipeline: write Markdown, render to HTML, let the platform apply styles. The preview here shows exactly the first rendering step.
Q5 · Do Markdown dialects differ between platforms?
Yes. Core syntax (headings, bold, lists) is universal, but tables, task lists, and footnotes are extensions — with GitHub Flavored Markdown (GFM) the most widely adopted. The same file can render differently on GitHub, WeChat, or Zhihu. This preview follows standard GFM behavior; do one final preview on the target platform before publishing.