Mermaid
Diagramm-Tool, das aus Prompts, Dokumenten oder Mermaid-Code Flussdiagramme und Systemdiagramme erstellt.
Mermaid ist ein Diagramm-Tool vom Team hinter der Open-Source-Bibliothek Mermaid.js. Mermaid erstellt Flussdiagramme, Sequenzdiagramme, Gantt-Diagramme und weitere Diagramme aus einem Text-Prompt, einem hochgeladenen Dokument oder selbst geschriebener Mermaid-Syntax. Mermaid läuft im Browser mit gemeinsamer Live-Bearbeitung und lässt sich über den MCP-Server aus KI-Tools ansteuern.
Am besten geeignet für Entwickler, Architekten und Produktteams, die Diagramme per KI erzeugen und trotzdem als Text bearbeiten wollen.
- Zu finden in
- Präsentationen und DiagrammeKI-Code-Assistent
- Plattformen
- Web, API, Plugin, MCP
- Preismodell
- Freemium
- Kostenloser Tarif
- Ja
- API
- Ja
- Anbieter
- Mermaid Chart
- Hinzugefügt
Zuletzt geprüft: . Die Angaben stammen von mermaid.ai.
Was ist Mermaid?
Mermaid ist ein Diagramm-Produkt von Mermaid Chart, dem Team hinter der Open-Source-Bibliothek Mermaid.js. Ein Diagramm lässt sich auf drei Wegen beginnen: durch eine Beschreibung in einem Prompt, durch das Hochladen eines Dokuments oder Transkripts oder durch direktes Schreiben von Mermaid-Syntax. Die KI behält den Kontext des Gesprächs, sodass sich ein Diagramm Schritt für Schritt erweitern lässt, und schlägt einen passenden Diagrammtyp für den Inhalt vor. Code und Arbeitsfläche bleiben verknüpft: Ein Klick auf einen Knoten springt zu seiner Zeile und umgekehrt. Unterstützt werden unter anderem Flussdiagramme, Sequenz-, Klassen-, Zustands- und ER-Diagramme, Gantt-Diagramme, Zeitleisten, Mindmaps und Organigramme. Teams können live gemeinsam bearbeiten, einen Link ohne Anmeldung teilen und aus demselben Workspace präsentieren. Integrationen gibt es für VS Code, GitHub Copilot und Confluence, und ein MCP-Server lässt Claude und Cursor Diagramme erzeugen und darstellen.
Wichtigste Funktionen
KI-Diagrammerstellung
Erstellt aus einer getippten Beschreibung, einem hochgeladenen Dokument oder einem eingefügten Transkript einen ersten Entwurf und verfeinert ihn über Folge-Prompts.
Code-Editor
Stellt Mermaid-Syntax schon beim Tippen dar und verknüpft jeden Knoten auf der Arbeitsfläche mit seiner Stelle im Code.
Visuelle Bearbeitung
Passt Layouts per Klick an, richtet Knoten aus und verbindet Kanten neu, ohne die Syntax umzuschreiben.
Live-Zusammenarbeit
Erlaubt mehreren Personen, gleichzeitig zu bearbeiten, und einen Ansichtslink zu teilen, für den kein Konto nötig ist.
MCP-Server und Integrationen
Erzeugt, prüft und rendert Diagramme aus Claude, VS Code und Cursor und funktioniert in GitHub Copilot und Confluence.
Präsentationsmodus
Führt ein Publikum durch ein Diagramm, ohne es in ein anderes Tool exportieren zu müssen.
Screenshots
Anwendungsfälle
- Systemarchitektur dokumentieren
- Services, Gateways und Datenspeicher abbilden und das Diagramm als Text unter Versionskontrolle halten.
- Einen API-Ablauf erklären
- In einem Sequenzdiagramm zeichnen, wie Komponenten einander aufrufen.
- Ein Projekt planen
- Phasen und Abhängigkeiten als Gantt-Diagramm oder Zeitleiste anlegen.
- Eine Datenbank entwerfen
- Tabellen und Beziehungen als ER-Diagramm skizzieren, bevor das Schema geschrieben wird.
- Besprechungsnotizen in ein Diagramm verwandeln
- Ein Transkript einfügen und ein Flussdiagramm der besprochenen Entscheidungen erhalten.
Gut zu wissen
- Die KI-Nutzung ist durch Credits begrenzt
- Die Vergleichstabelle gibt jeder Stufe ein KI-Credit-Kontingent, klein bei Basic und größer bei Plus und Premium.
- Kostenpflichtige Stufen werden mit jährlicher Abrechnung gezeigt
- Die monatlichen Beträge pro Nutzer auf der Preisseite tragen den Hinweis „jährlich abgerechnet“.
- Sicherheitsfunktionen
- Die Website nennt Zugriffskontrollen, Verschlüsselung, SOC-2-Konformität und Single Sign-on.
Häufige Fragen
Was ist Mermaid?
Mermaid ist ein Diagramm-Tool, das Prompts, Dokumente oder Mermaid-Code in Flussdiagramme, Sequenzdiagramme und andere Diagramme verwandelt, mit Live-Zusammenarbeit.
Was ist der Unterschied zwischen Mermaid und Mermaid.js?
Mermaid.js ist die Open-Source-Diagrammsyntax mit zugehöriger Bibliothek. Mermaid ist das gehostete Produkt desselben Teams, Mermaid Chart, das KI, einen visuellen Editor und Zusammenarbeit ergänzt.
Ist Mermaid kostenlos?
Ja, Mermaid hat einen kostenlosen Basic-Tarif mit einer begrenzten Zahl an Diagrammen, begrenzter Diagrammgröße und begrenzter KI.
Was kostet Mermaid?
Mermaid: Ein kostenloser Tarif ist verfügbar. Die Preise der kostenpflichtigen Tarife stehen auf mermaid.ai. Die aktuellen Beträge findest du auf der offiziellen Preisseite.
Kann ich Mermaid nutzen, ohne Code zu schreiben?
Ja. Mermaid kann ein Diagramm aus einer Beschreibung in normaler Sprache oder aus einer hochgeladenen Datei erzeugen, das Schreiben von Mermaid-Syntax ist optional.
Funktioniert Mermaid mit Claude und anderen KI-Tools?
Ja. Mermaid stellt einen MCP-Server bereit, der sich mit Claude, VS Code und Cursor verbindet, und funktioniert auch in GitHub Copilot.
Welche Diagrammtypen unterstützt Mermaid?
Mermaid unterstützt Flussdiagramme, Sequenz-, Klassen-, Zustands- und ER-Diagramme, Gantt-Diagramme, Zeitleisten, Mindmaps, Organigramme, User Journeys, Git-Graphen, Kreis- und Quadrantendiagramme und mehr.
Für wen es sich eignet
- Entwickler
- Systemarchitekten
- Produktmanager
- Technische Redakteure
- Analysten
In diesen Guides im Einsatz
- Die Folien kommen zuletzt: KI-Tools zum Recherchieren, Aufbauen und Proben einer PräsentationPhase 4: Diagramme
Jeder Guide nennt die Phasen eines Vorhabens und die Tools, die in der jeweiligen Phase helfen. Alle Guides
Kommentare
Noch keine Kommentare. Hast du Mermaid schon genutzt? Erzähl den anderen, wie es lief.
Alternativen zu Mermaid
| Tool | Kostenloser Tarif | Einstiegspreis | API |
|---|---|---|---|
| Ja | — | Ja | |
| Ja | — | — | |
| Ja | — | Ja | |
| Ja | — | — | |
| Ja | — | — |
Aus denselben Kategorien wie Mermaid. Ein Einstiegspreis steht nur dort, wo wir ihn auf der Preisseite des Anbieters geprüft haben. Ein Strich bedeutet: nicht geprüft oder nicht veröffentlicht. Alle Tools in Präsentationen und Diagramme