Markdown Preview & Viewer — render MD online, free
Paste Markdown and read it rendered instantly, Mermaid diagrams included, then tidy the source in one click. Free online viewer — nothing is ever uploaded.
Renders GitHub Flavoured Markdown, including ```mermaid diagrams. Formatting indents one tab per level, four columns wide, and never touches the code inside a fenced block.
About the Markdown preview tool
Markdown is designed to be readable as plain text, and mostly it is — but not once a document has a table in it, or nested lists, or images, or footnote-style link references collected at the bottom. At that point the raw source stops being the thing you are trying to check and starts being an obstacle to checking it. Paste it here and read what it actually becomes: headings at their real sizes, tables as tables, task lists with their boxes ticked, links resolved.
Which matters because markdown has no single implementation. CommonMark settled the ambiguities left in the original 2004 specification, GitHub Flavoured Markdown adds tables, task lists, strikethrough and automatic linking on top of that, and individual sites pile further extensions on again. This preview renders GitHub Flavoured Markdown, which is what most people now mean by the word, so what you see matches a README on GitHub or GitLab, a pull request description, an issue comment and most static site generators. Raw HTML embedded in the document renders too, but it is sanitized first — anything that could execute is stripped before it reaches the page.
Mermaid diagrams render as diagrams. Writing a flowchart, sequence, class, state, entity-relationship, Gantt or pie chart as text inside a ```mermaid fence has become normal since GitHub started drawing them in 2022, because a diagram kept as text lives in version control and shows up in a diff like everything else. Plenty of editors still show that fence as a plain code block, which is exactly when you need somewhere to check the thing before committing it. Diagrams here follow the page theme, and a fence that fails to parse keeps its source and reports the error rather than blanking the preview.
The second view formats the source. Headings are rewritten as hash marks, every bullet becomes the same character, ordered lists are renumbered so a list reading 1, 2, 2, 5 comes back as 1, 2, 3, 4, table cells are padded until the pipes line up into readable columns, fences get a consistent marker, and trailing spaces and runs of blank lines go. Nesting is indented one tab per level, read four columns wide, which is what CommonMark specifies. None of it changes what the document renders to — that is the guarantee a formatter has to make, and it is what makes running one across a repository a safe commit rather than a risky one.
How it works
Paste your Markdown
Drop in a README, a set of notes or a page exported from another editor. The document stays inside your browser.
Read it rendered
The preview updates as you type, with tables, task lists and Mermaid diagrams drawn the way the destination will draw them.
Switch to Formatted to tidy the source
One click reformats the markdown itself — aligned tables, consistent markers, tab indentation — ready to copy back into your file.
Frequently asked questions
- Which flavour of markdown does the preview use?
- GitHub Flavoured Markdown, which is CommonMark plus tables, task lists, strikethrough and automatic linking of bare URLs. That covers GitHub and GitLab READMEs, pull request descriptions, issue comments and most static site generators. It does not include site-specific extensions such as footnotes, admonition blocks or maths notation, so if your destination supports those they appear as plain text here while still rendering correctly there.
- Can it render Mermaid diagrams?
- Yes. Anything inside a ```mermaid fence is drawn rather than shown as code — flowcharts, sequence diagrams, class and state diagrams, entity-relationship diagrams, Gantt charts and pie charts. The diagram picks up whichever theme the page is in, so it stays readable in dark mode. If one diagram has a syntax error it keeps its source and shows the parser message above it; the rest of the document still renders.
- Why does my nested list collapse in some editors?
- Almost always indentation. A nested list has to be indented at least as far as the parent item text starts, so under a hyphen bullet two spaces is enough, but under a numbered marker you need three. Plenty of editors write two spaces regardless, which works for bullets and quietly fails for numbered lists. Formatting to a consistent four columns per level clears the entire class of problem, because four is enough for every marker.
- Does formatting change how the document renders?
- No, and that is the whole point. Every change is either to whitespace or to which of several interchangeable markers is used — a hyphen instead of an asterisk for a bullet, hash marks instead of an underline for a heading. Both spellings produce identical HTML, so the rendered page before and after is the same. Anything that would alter meaning, such as the contents of a code block, is left exactly as you wrote it.
- Why does it indent with tabs rather than spaces?
- Because CommonMark defines a tab as advancing to the next multiple of four columns, which is the same place four spaces land, so tab indentation is unambiguous under the standard while being one character instead of four and letting each reader pick their own display width. There is no setting for it: markdown indentation is semantic rather than cosmetic, so it is a correctness question with one answer, not a house-style preference worth a toggle.
- Does it reformat the code inside my code blocks?
- No. A fenced block is treated as opaque content and copied through unchanged — the language tag is kept, the indentation inside is kept, and nothing is re-wrapped. This is deliberate rather than a limitation: a markdown formatter that also rewrote embedded code would produce diffs nobody asked for, and would impose one language style on snippets collected from a dozen different projects.
- Is my document uploaded anywhere?
- No. The renderer, the diagram engine and the formatter are all downloaded into your browser and run there, so the text is read out of the box you typed it into and never crosses the network. You can confirm it by going offline first. That matters more than it sounds for markdown, which is where internal design documents, unpublished posts, architecture diagrams and notes full of hostnames tend to live.