Markdown-Live-Vorschau

Füge Markdown ein oder tippe es und sieh zu, wie es beim Schreiben gerendert wird. Die Vorschau folgt deinem Cursor Zeile für Zeile, entspricht der Ausgabe von GitHub und ergänzt, was GitHub weglässt – Diagramme, Formeln und Hinweise.

Kostenlos · keine Anmeldung · läuft im Browser, nichts wird hochgeladen

Markdown Viewer in geteilter Ansicht: Markdown-Quelltext links, gerenderte Vorschau im GitHub-Stil rechts
Geteilte Ansicht – Quelltext und gerenderte Vorschau nebeneinander, zeilengenau synchron scrollend.

Prüfe dein Markdown, bevor du veröffentlichst

Markdown ist leicht zu schreiben und leicht ein bisschen falsch zu machen: Eine fehlende Leerzeile macht aus einer Liste einen Absatz, ein verirrtes Leerzeichen zerlegt eine Tabelle, vier Leerzeichen werden zum Codeblock. Eine Live-Vorschau zeigt das Ergebnis sofort, sodass du die Formatierung beim Schreiben korrigierst statt nach einem Commit. Der Renderer folgt GitHub-Flavored Markdown – was du hier siehst, ist, wie eine README, eine Wiki-Seite oder eine Pull-Request-Beschreibung aussehen wird.

Zeilengenaues Scroll-Sync

Die meisten Vorschau-Tools scrollen beide Bereiche prozentual, was auseinanderläuft, sobald ein Dokument eine große Tabelle oder ein Bild enthält. Diese Vorschau ordnet jeden Block seiner Quellzeile zu, sodass der gerenderte Absatz neben der Zeile bleibt, die du bearbeitest – in beide Richtungen. Klicke eine Überschrift in der Gliederung an und beide Bereiche springen gemeinsam.

Mehr als einfaches Markdown

Die Vorschau rendert eingezäunten Code mit Hervorhebung für über 50 Sprachen, ```mermaid-Diagramme, $…$- und $$…$$-KaTeX-Formeln, GitHub-Hinweise (> [!WARNING]), Aufgabenlisten, Fußnoten, Emoji-Kürzel, Frontmatter und bereinigtes Inline-HTML wie <details>. Wechsle zwischen 16 Themes, um zu sehen, wie sich das Dokument hell und dunkel liest, und wähle Fließtext ohne Serifen, mit Serifen oder in Monospace. Diagramme haben ihre eigene Anleitung: Die Seite Mermaid Live Editor listet jeden Diagrammtyp auf, der gerendert wird.

In Aktion

KaTeX-Formel im Display-Modus und ein Mermaid-Flussdiagramm, gerendert in der Vorschau
KaTeX-Formeln und Mermaid-Flussdiagramme werden direkt im Dokument gerendert.
Note-, Important-, Warning- und Caution-Hinweise im GitHub-Stil, ein Zitat und ein aufklappbarer details-Abschnitt im Theme GitHub Dark
Hinweise im GitHub-Stil, Zitate und aufklappbare <details>-Abschnitte, in GitHub Dark.
Syntaxhervorgehobene TypeScript-, Python-, Bash- und diff-Codeblöcke mit Sprachlabels und Kopierbuttons
Codeblöcke bekommen ein Sprachlabel, Syntaxhervorhebung für über 50 Sprachen und einen Kopierbutton – hier das Theme One Dark.
Die Theme-Auswahl mit 16 hellen und dunklen Themes und Farbmustern
Sechzehn Themes, jedes mit eigener Syntaxpalette – oder der Hell/Dunkel-Einstellung des Systems folgen.

So funktioniert es

  1. 1
    Füge Markdown in den linken Bereich ein oder tippe es, oder lege eine .md-Datei ab.
  2. 2
    Der rechte Bereich rendert es live; scrolle eine Seite und die andere folgt.
  3. 3
    Kopiere das gerenderte HTML, exportiere die Seite oder lade das Markdown herunter, wenn es passt.

Was du bekommst

Sofortiges Rendering

Aktualisiert sich innerhalb weniger Millisekunden, auch bei langen Dokumenten.

GitHub-getreu

Dieselben Syntaxregeln wie GitHub-READMEs, Issues und Wikis.

Scroll-Sync pro Zeile

Vorschau und Quelltext bleiben ausgerichtet; auf Wunsch abschaltbar.

Diagramme und Formeln

Mermaid und KaTeX werden direkt in der Vorschau gerendert.

Themes und Typografie

16 Themes, drei Schriftfamilien, einstellbare Größe und Breite.

Kein Upload

Das Rendering passiert in deinem Browser; dein Text bleibt auf deinem Gerät.

Häufige Fragen

Ist die Vorschau dieselbe wie auf GitHub?
Sie folgt GitHub-Flavored Markdown bei Überschriften, Listen, Tabellen, Aufgabenlisten, Durchgestrichenem, Autolinks und Hinweisen. Mermaid, Formeln und Fußnoten werden ebenfalls gerendert, die GitHub nur teilweise unterstützt.
Kann ich eine Datei von einer URL ansehen?
Ja – Öffnen → Von URL akzeptiert jede rohe Markdown-URL, und GitHub-blob- oder Gist-Links werden automatisch in Raw umgewandelt.
Kann ich nur die Vorschau nutzen, ohne Editor?
Ja. Wähle die Ansicht Vorschau für eine Leseansicht in voller Breite mit der Gliederungs-Seitenleiste.
Wird HTML innerhalb von Markdown gerendert?
Ja, gängiges Inline-HTML wie <details>, <kbd>, <img> und <br> wird gerendert; Skripte, Styles und Event-Handler werden aus Sicherheitsgründen entfernt.
Wie bekomme ich das gerenderte HTML?
Exportieren → Als HTML kopieren legt das gerenderte Markup in die Zwischenablage; .html herunterladen speichert eine vollständige Seite mit dem aktuellen Theme.

Verwandte Werkzeuge

Bereit, wenn du es bist

Markdown einfügen, eine Datei ablegen oder eine URL öffnen – die Vorschau erscheint sofort und alles bleibt auf deinem Gerät.

Markdown Viewer öffnen