Markdown-Editor – Live-Vorschau und HTML online exportieren
Schreiben Sie Markdown in einem Editor mit sofortiger Vorschau und kopieren oder laden Sie sauberes HTML herunter – alles läuft lokal in Ihrem Browser.
Geben Sie links Markdown ein oder fügen Sie es ein und sehen Sie rechts das gerenderte Ergebnis. Ihre Eingaben werden nicht hochgeladen; der Editor läuft vollständig auf Ihrem Gerät.
Markdown-Editor – Live-Vorschau und HTML online exportieren
Schreiben Sie Markdown in einem Editor mit sofortiger Vorschau und kopieren oder laden Sie sauberes HTML herunter – alles läuft lokal in Ihrem Browser.
Vorschau
Wörter: 0Zeichen: 0
So funktioniert es: Die Quelle wird mit einer CommonMark-kompatiblen Engine verarbeitet (Tabellen, umzäunter Code und Durchstreichungen aktiviert), rohes HTML ist aus Sicherheitsgründen deaktiviert und die Vorschau zeigt genau das HTML, das Sie kopieren oder herunterladen können.
Über den Online-Markdown-Editor
Dieser Markdown-Editor bietet eine ablenkungsfreie Schreibfläche mit einer Live-Vorschau direkt daneben. Geben Sie Markdown in das Quelltextfeld ein oder fügen Sie es dort ein. Das gerenderte Ergebnis wird bei jeder Eingabe aktualisiert, sodass Sie vor der Veröffentlichung genau sehen, wie Überschriften, Listen, Links, Tabellen und Codeblöcke aussehen. Alles geschieht lokal in Ihrem Browser: Der Parser läuft auf Ihrem Gerät, ein Konto ist nicht erforderlich und Ihre Eingaben werden niemals an einen Server hochgeladen. Dadurch eignet sich der Editor für private Notizen, interne Dokumentation und unveröffentlichte Entwürfe.
Die Vorschau basiert auf einem CommonMark-kompatiblen Renderer und unterstützt die von den meisten Schreibenden erwarteten GitHub-Erweiterungen. Tabellen mit Pipe-Trennzeichen, umzäunte Codeblöcke, Durchstreichungen mit doppelten Tilden, automatische Verknüpfungen nackter URLs sowie typografische Ersetzungen wie typografische Anführungszeichen, Gedankenstriche und Auslassungspunkte funktionieren sofort. Rohes HTML im Quelltext ist bewusst deaktiviert, sodass ein eingefügtes Snippet keine Skripte oder Styles in die Vorschau einschleusen kann. Die kopierte oder heruntergeladene Ausgabe ist einfaches, vorhersehbares Markup, das sich überall gleich verhält.
Wenn Ihr Dokument fertig ist, stehen mehrere Exportwege zur Verfügung. HTML kopieren legt das gerenderte Markup in die Zwischenablage, sodass Sie es direkt in ein CMS, eine E-Mail-Vorlage oder ein Layout für eine statische Website einfügen können. HTML herunterladen verpackt dasselbe Markup in eine vollständige eigenständige Webseite mit korrektem Doctype, Zeichencodierung und Viewport-Angabe. Sie können sie in jedem Browser öffnen oder an Kollegen weitergeben. Markdown herunterladen speichert den Quelltext als .md-Datei zur Versionsverwaltung oder späteren Bearbeitung, während Leeren den gesamten Arbeitsbereich mit einem Klick zurücksetzt.
Unter dem Editor werden Wort- und Zeichenzahlen live angezeigt. Das ist praktisch, wenn Sie ein Längenlimit einhalten müssen – etwa bei einer Blog-Einleitung, Produktbeschreibung, README-Sektion oder Konferenzzusammenfassung. Da der Zähler reine Satzzeichentokens wie Rautenzeichen und Pipes ignoriert, entspricht die Zahl den Wörtern, die ein Leser tatsächlich sieht, und nicht dem umgebenden Markup.
Der Editor ist bewusst leichtgewichtig und keine vollständige Publishing-Pipeline. Er synchronisiert Dokumente nicht zwischen Geräten, rendert weder LaTeX-Mathematik noch Mermaid-Diagramme und exportiert nicht direkt nach PDF oder DOCX. Für diese Aufgaben können Sie ihn mit einem spezialisierten Konverter kombinieren. Was er kann, erledigt er sofort: schnelles, privates Markdown-Schreiben mit zuverlässiger Vorschau und sauberem HTML-Export – kostenlos und ohne Anmeldung.
Beispiele für den Markdown-Editor
Einige typische Snippets und das Ergebnis der Live-Vorschau.
| Ihr Markdown | Anzeige der Vorschau | Warum es funktioniert |
|---|---|---|
| ## Release-Checkliste | Eine Überschrift der zweiten Ebene | Ein bis sechs # am Zeilenanfang erzeugen Überschriften von h1 bis h6. |
| | Name | Anzahl | | --- | --- | | Stifte | 12 | | Eine zweispaltige Tabelle mit Kopfzeile | Pipes und eine Trennzeile aus Bindestrichen erzeugen Tabellen im GitHub-Stil. |
| ~~alter Preis~~ $19 | Durchgestrichener Text vor dem neuen Preis | Umschließen Sie Text mit zwei Tilden, um ihn durchzustreichen. |
| Besuchen Sie heute https://example.com | Die nackte URL wird zu einem anklickbaren Link | Automatische Verknüpfungen sind aktiviert, daher werden normale URLs ohne spitze Klammern erkannt. |
So verwenden Sie den Markdown-Editor
- Geben Sie links im Quelltextfeld Markdown ein oder fügen Sie es ein – die gerenderte Vorschau rechts wird während der Eingabe aktualisiert.
- Behalten Sie die Wort- und Zeichenzähler unter dem Editor im Blick, wenn Sie ein Längenlimit einhalten müssen.
- Klicken Sie auf HTML kopieren, um das gerenderte Markup in die Zwischenablage zu legen, oder auf HTML herunterladen, um eine vollständige eigenständige Webseite zu speichern.
- Mit Markdown herunterladen speichern Sie die .md-Quelle, mit Beispiel laden erkunden Sie ein Demodokument und mit Leeren beginnen Sie von vorn.
FAQ zum Markdown-Editor
Wird mein Text irgendwo hochgeladen?
Nein. Analyse und Rendering der Vorschau laufen vollständig in Ihrem Browser über eine JavaScript-Engine in der Seite. Ihr Text verlässt Ihr Gerät nie und wird beim Schließen des Tabs verworfen. Damit ist der Editor für vertrauliche Entwürfe geeignet.
Welche Markdown-Syntax unterstützt der Editor?
Er folgt CommonMark und unterstützt außerdem die beliebten GitHub-Erweiterungen: Pipe-Tabellen, umzäunte Codeblöcke, Durchstreichungen und automatische Links für nackte URLs. Hervorhebungen mit Sternchen oder Unterstrichen, verschachtelte Listen, Zitate und Bilder werden ebenfalls wie erwartet gerendert.
Warum wird rohes HTML in meinem Markdown nicht gerendert?
Die direkte Weitergabe von rohem HTML ist absichtlich deaktiviert. So wird verhindert, dass eingefügter Inhalt Skripte oder Styles in die Vorschau einschleust (ein häufiger XSS-Vektor), und das exportierte Markup bleibt sauber. Verwenden Sie Markdown-Syntax statt Inline-Tags.
Wie mache ich aus meinem Markdown eine vollständige Webseite?
Klicken Sie auf HTML herunterladen. Der Editor verpackt das gerenderte Markup in ein vollständiges Dokument mit Doctype, Charset und Viewport-Metadaten. Die gespeicherte Datei lässt sich ohne weitere Arbeit in jedem Browser korrekt öffnen.
Kann ich das exportierte HTML in WordPress oder eine E-Mail einfügen?
Ja. HTML kopieren liefert einfaches semantisches Markup ohne externe Stylesheets oder Skripte. Es lässt sich sauber in CMS-Code-Editoren, E-Mail-Builder und Dokumentationssysteme einfügen. Das Styling übernimmt anschließend das eigene Theme des Zielsystems.