How to Preview Markdown Before Publishing

Markdown looks clean in a text editor. It can look quite different when rendered. A heading intended as H2 becomes H1. A code block appears without syntax highlighting. A table with uneven separators doesn't render as a table at all. None of this is visible until you see it rendered.

Why preview matters

Markdown is a source format — the rendered output is what readers see, not the source. Writing Markdown without previewing is like writing HTML and never opening it in a browser. The source can be syntactically correct and still produce something that looks wrong.

For READMEs, documentation, and blog posts, a formatting mistake is visible to every reader. Catching it before publishing takes 30 seconds. Catching it after requires an edit cycle, a new commit, or waiting for someone to report it.

What commonly looks different from source

Heading levels. A single # creates H1. Two ## creates H2. Accidentally using one instead of two — or mixing them — produces a heading hierarchy that looks inconsistent in rendered output.

Code blocks. Inline code uses single backticks: `code`. Fenced code blocks use triple backticks. A single backtick where triple was intended renders as inline code instead of a formatted block — no syntax highlighting, no preserved indentation.

Lists with inconsistent indentation. Nested list items require consistent indentation — usually 2 or 4 spaces. One-space indentation often renders as a flat continuation rather than a nested item, depending on the renderer.

Tables. The separator row needs at least 3 dashes per column: | --- |. One dash often fails to render as a table at all, producing raw pipe characters and text.

Paragraph breaks. A single newline in Markdown is ignored by most renderers — it becomes a space, not a line break. Two newlines create a paragraph break. This is the most common source of "why is everything in one paragraph?" questions.

Markdown flavors and renderer differences

Standard Markdown defines the basics. GitHub Flavored Markdown (GFM) adds tables, task lists, and strikethrough. CommonMark is a strict specification used by many static site generators. Some systems support footnotes, definition lists, and math; others don't.

A generic preview tool shows you standard Markdown behaviour. If your content will be rendered by GitHub, Notion, your CMS, or your static site generator, previewing in that exact environment is more reliable than a generic tool — especially for extension features like task lists or tables.

Quick workflow: for short edits (a README update, a one-section documentation change), paste the Markdown into a browser-based preview tool. It's faster than committing and checking on GitHub or rebuilding a local static site just to see how three paragraphs render.