Markdown zu HTML

Dieses Werkzeug wandelt Markdown direkt in Ihrem Browser in HTML um, ohne dass etwas auf einen Server hochgeladen wird. Entwickler, technische Redakteure und Blogger kommen meist mit einer README, einer Dokumentationsseite, KI-generierten Notizen oder einem Entwurf, der zu HTML für ein CMS oder eine E-Mail werden soll. Tippen oder fügen Sie das Markdown ein, die Vorschau aktualisiert sich beim Tippen, und Sie können das HTML kopieren oder als Datei herunterladen. Diese Seite ist der Einstieg mit Fokus auf die Umwandlung; dasselbe Werkzeug gibt es auch als Markdown-Vorschau.

Was diese Umwandlung tatsächlich tut (und was NICHT)

Der Parser ist pulldown-cmark, ein in Rust geschriebener CommonMark-Parser, mit drei aktivierten Erweiterungen: Pipe-Tabellen, ~~Durchstreichungen~~ und Aufgabenlisten-Syntax. Dasselbe Markdown ergibt immer dasselbe HTML. Das erzeugte HTML durchläuft anschließend einen Sanitizer (ammonia), bevor es angezeigt, kopiert oder heruntergeladen wird. Dadurch lässt sich die Ausgabe sicherer einfügen, aber es wird auch einiges entfernt, das Sie vielleicht behalten möchten:

• Relative URLs werden entfernt. Ein Link wie [Doku](/anleitung) behält seinen Text, verliert aber den href, und ein Bild mit relativem src verliert den src. Nur absolute http-, https- und mailto-URLs bleiben erhalten.
• Klassen und IDs werden entfernt, auch die Klasse language-xxx umzäunter Codeblöcke. Codeblöcke erscheinen als schlichtes <pre><code> ohne Ansatzpunkt für einen Syntax-Highlighter.
• Checkboxen von Aufgabenlisten werden entfernt. - [x] erledigt wird erkannt, das Ergebnis ist aber ein normaler Aufzählungspunkt ohne Checkbox.
• Skripte, Style-Blöcke, style-Attribute, Event-Handler wie onerror, HTML-Kommentare und javascript:-Links werden entfernt. Links erhalten rel="noopener noreferrer".

Einige Funktionen von GitHub Flavored Markdown werden nicht unterstützt: Fußnoten ([^1]) werden nicht gerendert, und nackte URLs wie https://example.com werden nicht zu Links (setzen Sie sie in spitze Klammern, <https://example.com>, um einen Link zu erhalten). Anker für Überschriften werden nicht erzeugt.

Die Ausgabe ist ein HTML-Fragment: nur das Body-Markup (<h1>, <p>, <table> und so weiter), ohne <!DOCTYPE>, <head> oder CSS. Genau das brauchen Sie für ein CMS-Feld oder einen E-Mail-Editor. Für eine eigenständige Seite betten Sie das Fragment in Ihre eigene Dokumentvorlage ein. Rohes HTML in Ihrem Markdown wird durchgereicht, sofern der Sanitizer die Tags erlaubt (zum Beispiel <details>), und von unsicheren Attributen befreit.

Wann Sie diese Umwandlung wählen sollten

Wählen Sie Markdown zu HTML, wenn Sie Ausgabe für Web oder E-Mail brauchen und das Markdown als bearbeitbare Quelle behalten wollen. Es ist der Veröffentlichungsschritt: in Markdown schreiben, HTML für das Ziel erzeugen. Wenn Sie dagegen unsauberes HTML haben (einen CMS-Export, eine E-Mail, KI-Ausgabe in Tags) und sauberes Markdown möchten, verwenden Sie HTML zu Markdown. Wenn Ihr Inhalt auf relativen Links oder Bildern beruht, machen Sie die URLs vorher absolut oder nutzen Sie einen Konverter, der sie beibehält.

So wandeln Sie um

1. Tippen oder fügen Sie Ihr Markdown in den Editor ein.
2. Beobachten Sie, wie sich die Vorschau beim Bearbeiten aktualisiert, sodass Sie Überraschungen bei Überschriften, Listen und Tabellen sofort bemerken.
3. Verwenden Sie absolute URLs für Links und Bilder, wenn Sie diese in der Ausgabe brauchen.
4. Kopieren Sie das HTML in die Zwischenablage oder laden Sie es als .html-Datei herunter.

Kein Upload. Es läuft auf Ihrem Gerät.

Die Umwandlung ist Rust, kompiliert zu WebAssembly, und läuft vollständig in Ihrem Browser. Es gibt keine Netzwerkanfragen für die Umwandlung und danach nichts zu löschen, weil nichts hochgeladen wurde. Sie können das im Netzwerk-Tab der DevTools Ihres Browsers überprüfen. Das ist wichtig, weil Markdown oft sensibles Material enthält: interne READMEs, technische Dokumentation, unveröffentlichte Produktnotizen oder Ausgaben von KI-Werkzeugen, die Sie nicht auf einem fremden Server einfügen möchten.

Keine Grenzen

Keine Längenbegrenzung, kein Wasserzeichen auf der Ausgabe, keine Anmeldung. Die praktische Grenze ist der Arbeitsspeicher Ihres Geräts.

Häufig gestellte Fragen

Welche Markdown-Funktionen werden unterstützt?

CommonMark (Überschriften, Hervorhebungen, Listen, Links, Bilder, Zitate, Codeblöcke, harte Zeilenumbrüche) plus Pipe-Tabellen, Durchstreichungen und Aufgabenlisten-Syntax. Fußnoten und automatische Links aus nackten URLs werden nicht unterstützt.

Warum haben meine relativen Links ihre URL verloren?

Der Sanitizer erlaubt nur absolute http-, https- und mailto-URLs. Relative hrefs und Bild-srcs werden entfernt, verwenden Sie daher vollständige URLs, wenn Sie sie im HTML brauchen.

Zeigen Aufgabenlisten Checkboxen an?

Nein. Die Markierungen [ ] und [x] werden erkannt, aber der Sanitizer entfernt die Checkboxen, sodass die Einträge als normale Aufzählungspunkte erscheinen.

Fügt es Codeblöcken Syntaxhervorhebung hinzu?

Nein. Codeblöcke werden als schlichter vorformatierter Text gerendert, und die Sprachklasse wird vom Sanitizer entfernt, sodass ein Highlighter auf Ihrer Website die Sprache aus dieser Ausgabe nicht erkennen kann.

Kann ich eine vollständige, eigenständige HTML-Datei mit CSS erhalten?

Nein, die Ausgabe ist ein Fragment ohne <head> und ohne Styles. Die heruntergeladene .html-Datei enthält dasselbe Fragment. Betten Sie es in Ihre eigene Vorlage ein, wenn Sie eine komplette Seite brauchen.

Wie wandle ich Markdown-Tabellen in HTML-Tabellen um?

Schreiben Sie die Tabelle in Pipe-Syntax: eine Kopfzeile, eine Trennzeile mit Bindestrichen, dann die Datenzeilen. Daraus werden echte <table>-, <thead>-, <tr>- und <td>-Elemente.

Ist das umgewandelte HTML sicher zum Einfügen in WordPress, eine E-Mail oder ein CMS?

Die Ausgabe ist bereinigt: Skripte, Inline-Styles, Event-Handler, Kommentare und unsichere URL-Schemata werden entfernt, und Links erhalten rel="noopener noreferrer". Prüfen Sie das Ergebnis trotzdem vor dem Veröffentlichen, damit nichts Benötigtes entfernt wurde.

Bleibt rohes HTML in meinem Markdown erhalten?

Teilweise. Erlaubte Tags werden durchgereicht, aber unsichere Tags, Attribute wie class, id und style sowie relative URLs werden entfernt.

Wird mein Markdown auf einen Server hochgeladen?

Nein. Die Umwandlung läuft in Ihrem Browser über Rust, kompiliert zu WebAssembly, ohne Netzwerkanfragen für die Umwandlung.

Wie unterscheidet sich das vom lokalen Ausführen von Pandoc?

Beide behalten Ihren Inhalt auf Ihrem Rechner. Pandoc ist ein Kommandozeilen-Werkzeug zum Installieren, mit vielen Formaten und Optionen, darunter eigenständige Dokumente und Fußnoten. Diese Seite braucht keine Installation und bietet eine Live-Vorschau mit bereinigter Ausgabe, für schnelle Umwandlungen.

Für die umgekehrte Richtung siehe HTML zu Markdown, oder nutzen Sie die vollständige Markdown-Vorschau. Durchsuchen Sie weitere Konverter im Hub für Text- und Datenwerkzeuge.