Markdown-Vorschau

Was ist Markdown?

Markdown ist eine leichtgewichtige Auszeichnungssprache, die John Gruber 2004 entwickelt hat, um formatierten Text mit nichts als einer einfachen Tastatur zu schreiben. **fett**, # Überschriften, - Listen — kleine Konventionen, die zu sauberem HTML werden. Es ist das Standardformat für README-Dateien auf GitHub, Beiträge auf Reddit und Stack Overflow, Dokumentationsgeneratoren und die meisten Notiz-Apps. Diese Vorschau parst deine Eingabe mit der marked-Bibliothek und zeigt das gerenderte HTML neben der Quelle, damit du schnell iterieren kannst, ohne die Seite zu verlassen.

So verwendest du diese Vorschau

Tippe oder füge Markdown links ein. Der rechte Bereich rendert beim Tippen neu. Aktiviere GitHub-Flavor, um Erweiterungen wie Tabellen, Aufgabenlisten und Durchstreichungen zu nutzen. Aktiviere Bei Zeilenumbruch trennen, wenn jeder Zeilenumbruch zu einem <br> werden soll (die meisten Editoren bevorzugen den Standard, bei dem du eine Leerzeile zwischen Absätzen brauchst). Klicke auf HTML kopieren, um das gerenderte HTML in die Zwischenablage zu legen — füge es in ein CMS, eine E-Mail oder irgendwohin ein, das HTML akzeptiert.

Schnelle Syntaxreferenz

Die häufigsten Markdown-Tokens. Die Vorschau akzeptiert die vollständige CommonMark-Spezifikation plus die GitHub-Flavor-Erweiterungen, wenn der GFM-Schalter aktiv ist.

Markdown	Wird gerendert als
`# Title`	Überschrift erster Ebene
`bold`	fett
`italic`	kursiv
`code`	`Inline-Code`
`[text](url)`	Hyperlink
`- item`	Listenpunkt
`> quote`	Blockzitat
`\| a \| b \|`	Tabellenzeile (GFM)

Häufig gestellte Fragen

Wird mein Markdown irgendwohin gesendet?

Nein. Das Parsen geschieht vollständig in deinem Browser mithilfe der marked-Bibliothek, die von einem öffentlichen CDN geladen wird. Nach dem ersten Laden des Skripts werden keine weiteren Anfragen gestellt — Tippen und Rendern sind zu 100 % offline. Öffne DevTools > Netzwerk und du wirst beim Bearbeiten keinen Traffic sehen. Sicher für Entwürfe, interne Dokumente und alles, was du nicht in einen gehosteten Editor einfügen würdest.

Was bewirkt der GFM-Schalter?

GitHub-Flavored Markdown erweitert die CommonMark-Basis um: Tabellen, Aufgabenlisten (- [x] erledigt), Durchstreichung (~~Text~~), Autolinks und leicht abweichende Listen-/Absatzregeln. Mit aktivem Schalter siehst du das GitHub-Rendering; ohne ihn striktes CommonMark. Die meisten Plattformen (GitHub, GitLab, Stack Overflow) verwenden GFM, lass ihn also standardmäßig an.

Warum erzeugt ein einzelner Zeilenumbruch keine neue Zeile?

Laut Markdown-Spezifikation ist ein einzelner Zeilenumbruch nur ein Leerzeichen — Absätze werden durch Leerzeilen getrennt. Das entspricht dem Reflow-Verhalten von Word/Google Docs und dem, was GitHub macht. Wenn du möchtest, dass jeder Zeilenumbruch trennt (z. B. für Gedichte, Namenslisten, Logzeilen), aktiviere den Schalter Bei Zeilenumbruch trennen.

Ist die Ausgabe sicher zum Einfügen auf meiner Website?

Sei vorsichtig mit nicht vertrauenswürdigem Markdown. Markdown lässt rohes HTML durch, sodass eine bösartige Quelle ein <script>-Tag einbetten könnte, das ausgeführt wird, wenn du das gerenderte HTML irgendwo einfügst, das nicht bereinigt. Diese Vorschau dient zur Inspektion — wenn du nutzergenerierten Markdown auf deiner Site verarbeitest, jage die Ausgabe vor der Auslieferung serverseitig durch einen Sanitizer wie DOMPurify.

Kann ich nach PDF oder Word exportieren?

Nicht direkt hier, aber der Workflow ist einfach: Kopiere das gerenderte HTML mit dem Button, füge es in einen Dokumenteneditor ein (Google Docs, Pages, LibreOffice erhalten beim Einfügen die HTML-Formatierung) und exportiere von dort. Für PDF ist der einfachste Weg, das gerenderte HTML zu drucken — der Druckdialog deines Browsers bietet das Ziel „Als PDF speichern".

Warum wird in meiner Ausgabe etwas HTML als Rohtext gerendert?

Markdown erlaubt absichtlich Inline-HTML — alles zwischen < und >, das wie ein Tag aussieht, wird unverändert durchgereicht. Wenn du HTML anzeigen statt rendern möchtest, escape die spitzen Klammern (< und >) oder packe das Snippet in einen eingezäunten Codeblock (drei Backticks). Derselbe Trick funktioniert für jede wörtliche Markdown-Interpunktion.

Markdown-Vorschau