ToolCabana

Editor di diagrammi Mermaid

Anteprima di diagrammi sanificati ed esportazione in SVG o PNG.

Favorites are saved in this browser. Find them in My favorites.

Editor di diagrammi Mermaid

Your input stays in this browser unless stated otherwise
Clear your input, files and result, and restore the default settings.
Load sample text to explore what this tool can do. This replaces your current input.
0 charactersClear the source text.

Come usare Editor di diagrammi Mermaid

The Mermaid diagram editor renders Mermaid text, such as a flowchart LR definition, into a diagram preview and lets you download it as SVG or PNG. Rendering runs in Mermaid's strict security mode, and the SVG is sanitized to remove scripts and embedded HTML. Diagrams can be up to 20,000 characters and 300 lines.

  1. Incolla l'origine nell'editor di input, oppure carica l'esempio integrato.
  2. Imposta il formato di download.
  3. Esegui l'editor di diagrammi Mermaid, esamina il risultato, poi usa i controlli disponibili per copiare o scaricare.

Cosa supporta questo strumento

Anteprima di diagrammi sanificati ed esportazione in SVG o PNG.

Formato di download
SVG · PNG

Limiti ed elaborazione

Le immagini usano il limite esistente della tela di 32 megapixel. Sono consentite fino a 100 immagini di origine dove supportato. L'HTML incollato è limitato a 200.000 caratteri; i diagrammi Mermaid a 20.000 caratteri e 300 righe. La generazione SVG e PNG richiede un browser.

Origine di esempio
flowchart LR
  A[Choose a tool] --> B[Add your input]
  B --> C[Review the result]

Domande frequenti

How do I export a Mermaid diagram as PNG?

Paste your Mermaid code, set Download format to PNG and run the editor. The sanitized SVG is drawn onto a canvas and saved as diagram.png, capped at 8,000 pixels per side. Choose SVG instead for a scalable vector file.

Why is my Mermaid init directive or front matter rejected?

Configuration directives such as %%{init: ...}%% and front matter blocks starting with --- are disabled for safety, and the editor returns an error if they appear. Themes and other settings in those blocks are not applied, so remove them before rendering.

Why do HTML labels not appear in my diagram?

Diagrams render with Mermaid's strict security level and flowchart HTML labels turned off, and the output is sanitized to strip script and foreignObject elements. Use plain-text labels inside node brackets, such as A[Choose a tool], instead of HTML markup.

Dove viene elaborato il mio input?

Questa operazione elabora i dati di origine nel tuo browser. Copia e download sono azioni esplicite; l'input di origine non viene salvato in un account né in una cronologia.

Quali sono i limiti di input?

Le immagini usano il limite esistente della tela di 32 megapixel. Sono consentite fino a 100 immagini di origine dove supportato. L'HTML incollato è limitato a 200.000 caratteri; i diagrammi Mermaid a 20.000 caratteri e 300 righe. La generazione SVG e PNG richiede un browser.