Anleitung: Markdown in HTML umwandeln
- Schreiben Sie im linken Eingabefeld Text in Markdown-Syntax oder fügen Sie den Inhalt einer README.md ein.
- Rechts sehen Sie in der Vorschau das tatsächliche Erscheinungsbild und im Reiter HTML-Code die erzeugten Tags.
- Mit HTML kopieren übernehmen Sie das Ergebnis in den HTML-Editor Ihres Blogs oder eine E-Mail-Vorlage – oder Sie wählen Als .html-Datei speichern und öffnen die Datei im Browser.
- Ihr Text wird automatisch in diesem Browser gespeichert und ist beim nächsten Besuch noch da.
Markdown-Syntax im Überblick (häufige Auszeichnungen)
| Element | Markdown | HTML-Ergebnis |
|---|---|---|
| Überschrift | # Überschrift 1, ## Überschrift 2 | <h1>, <h2> |
| Fett / kursiv | **fett**, *kursiv* | <strong>, <em> |
| Durchgestrichen | ~~gestrichen~~ | <del> |
| Link | [Tooljip](https://tooljip.com) | <a href> |
| Bild |  | <img> |
| Liste | - Eintrag, 1. Eintrag | <ul>, <ol> |
| Checkliste | - [x] erledigt | Liste mit Kontrollkästchen |
| Zitat | > Zitat | <blockquote> |
| Inline-Code | `code` | <code> |
| Codeblock | ```js … ``` | <pre><code> |
| Tabelle | | Name | Wert ||---|---| | <table> |
| Trennlinie | --- | <hr> |
Wie Markdown zu HTML wird – Regeln und Stolperfallen
Markdown kennzeichnet die Struktur eines Dokuments mit gut lesbaren Textzeichen; ein Konverter wandelt diese in HTML-Tags um. Tooljip nutzt die verbreitete Bibliothek marked mit den Regeln von GitHub Flavored Markdown (GFM). Das Ergebnis entspricht daher weitgehend der Darstellung einer README auf GitHub.
- Zeilenumbrüche: Ein einfacher Druck auf die Eingabetaste setzt den Text im selben Absatz fort. Für einen neuen Absatz fügen Sie eine Leerzeile ein.
- Einrückung von Listen: Unterpunkte rücken Sie mit 2 bis 4 Leerzeichen ein.
- Sonderzeichen: Soll
*oder#wörtlich erscheinen, setzen Sie einen Backslash davor (\*). - HTML direkt verwenden: Sie können HTML-Tags in Markdown mischen; sie bleiben im Ergebnis unverändert erhalten.
Die Vorschau ist sicher abgeschottet
Auch wenn kopiertes Markdown Code wie <script> enthält, zeigt Tooljip die Vorschau in einem isolierten Bereich (Sandbox-iframe) an, in dem keine Skripte ausgeführt werden. Das reine Ansehen der Vorschau beeinflusst Ihren Browser also nicht.
Anders sieht es aus, wenn Sie den erzeugten HTML-Code unverändert auf Ihrer eigenen Website veröffentlichen. Wenn Sie Markdown aus fremden Quellen in einem Forum oder Webdienst verwenden, sollten Sie es serverseitig bereinigen (Sanitizing), sodass nur erlaubte Tags übrig bleiben.
Praktisch für Blogartikel und READMEs
GitHub-READMEs, Notizen in Notion oder Obsidian und viele Tech-Blogs setzen auf Markdown. Manche Blogsysteme oder Newsletter-Editoren akzeptieren dagegen nur HTML. Schreiben Sie Ihren Entwurf schnell in Markdown, erzeugen Sie hier das HTML und fügen Sie es ein – das spart viel Formatierungsarbeit. Wie lang Ihr Text ist, prüfen Sie mit dem Zeichenzähler.
Die Umwandlung läuft vollständig in Ihrem Browser. Ihre Texte werden nicht an einen Server übertragen.