Index

Markdown Visualizer

Write Markdown on the left, read it on the right. Live preview with code, tables, and Mermaid diagrams.

Markdown Visualizer is a split screen Markdown editor for READMEs, docs, changelogs, and notes. You write in the same Monaco editor that powers VS Code, and the preview renders as you type, with GitHub Flavored Markdown, highlighted code blocks, and Mermaid diagrams drawn inline. Resize the panes, expand either one with a shortcut, and pick up where you left off after a refresh. No account, and no backend of its own that stores your writing.

Open Markdown Visualizer Support

Free · Web

What it does

  • The editor you already know

    Writing happens in Monaco, the editor inside VS Code, with Markdown syntax highlighting and the keyboard behaviour your hands expect. It follows your light or dark theme.

  • A preview that keeps up

    The right pane re-renders on every keystroke. Headings, lists, blockquotes, tables, and task lists render the way GitHub renders them, so what you see is what your README will look like.

  • Code and diagrams, rendered

    Fenced code blocks are syntax highlighted in the preview. A mermaid block is drawn as a real diagram, so flowcharts and sequence diagrams live next to the prose that explains them.

  • Panes that get out of the way

    Drag the divider to resize. Cmd or Ctrl and E expands the editor to full width, Cmd or Ctrl, Shift, and P does the same for the preview, and pressing it again brings the split back.

  • Nothing lost on refresh

    Each tab saves its document to the browser's IndexedDB as you type. Reload, close the laptop, come back, and your draft is still there.

  • Works on a phone and offline

    On small screens the split becomes two tabs, Editor and Preview. It installs as a progressive web app and keeps working without a connection once it has loaded.

Private by design

  • Your Markdown is rendered in your browser. There is no backend that stores it.
  • Drafts are saved in the browser's IndexedDB, one document per tab.
  • No account and no sign-up.
  • Google Analytics and Microsoft Clarity measure how the site is used. Clarity records sessions, which can include what is visible on screen, so avoid pasting anything sensitive.

Markdown Visualizer is the younger sibling of JSON Visualiser, built on the same bones for the other format I read all day. Write on the left, read on the right, and stop pushing a README three times to see whether the table lines up.

It is a static app on md.milind.app. The editor is Monaco, the same one inside VS Code. The preview is rendered with Streamdown, which handles GitHub Flavored Markdown, highlights code, and draws Mermaid diagrams inline.

How it works

  • Write in the editor on the left. The preview on the right updates on every keystroke.
  • Drag the divider to give either side more room.
  • Cmd or Ctrl and E to expand the editor, Cmd or Ctrl, Shift, and P to expand the preview.
  • Copy the whole document when you are done, or Clear to start fresh.

Good for

  • READMEs and project docs
  • Changelogs and release notes
  • Architecture notes with Mermaid diagrams
  • Anything headed for GitHub, a docs site, or a static blog

One draft per tab

Every tab keeps its own document in IndexedDB, so a refresh never costs you a draft and two tabs never overwrite each other. On a phone the split becomes two tabs, and it installs as a progressive web app that works offline.

Free, with no catch

No account. No sign-up. No ads. Open source on GitHub. Just a clean place to write Markdown and see it rendered.