Editor di diagrammi Mermaid

Scrivi codice Mermaid e vedi diagrammi di flusso, di sequenza e altro; esporta SVG o PNG
  • I file non lasciano il dispositivo
  • Funziona nel browser
  • Gratis, senza account, senza filigrana
PreviewLoading Mermaid…

Come usare Editor di diagrammi Mermaid

Scrivi codice Mermaid e vedi il diagramma mentre digiti: diagrammi di flusso, di sequenza, di classe, di stato, ER, Gantt, a torta, mappe mentali, timeline e grafi Git. Fai zoom e spostati sull'anteprima, poi esporta SVG o PNG fino a 4×. Il rendering avviene nel browser.

  1. 1

    Digita codice Mermaid nell'editor, oppure scegli un diagramma da Esempio da cui partire.

  2. 2

    Scegli un Tema: Predefinito, Neutro, Scuro o Foresta.

  3. 3

    Controlla l'anteprima. Scorri o pizzica per lo zoom, trascina per spostarti e usa Adatta alla vista o Schermo intero.

  4. 4

    Imposta Sfondo e dimensione PNG, poi fai clic su SVG o PNG per scaricare, oppure su Copia SVG / Copia PNG per gli appunti.

Domande frequenti

Il codice del mio diagramma viene inviato a un server?

No. Mermaid gira dentro la pagina, quindi codice e diagrammi restano nel browser. Il codice viene salvato in locale, così c'è ancora la volta dopo.

Cosa succede quando il codice ha un errore di sintassi?

L'errore compare sotto l'editor con il numero di riga e l'anteprima continua a mostrare l'ultimo diagramma che è stato renderizzato.

Posso esportare con uno sfondo trasparente?

Sì. Imposta Sfondo su Trasparente prima di esportare SVG o PNG.

Come ottengo un PNG più nitido?

Scegli una dimensione PNG di 2×, 3× o 4×. Le dimensioni esatte in pixel sono mostrate accanto all'impostazione.

C'è una scorciatoia da tastiera per salvare?

Ctrl/⌘ + S nell'editor scarica l'SVG. Nell'anteprima, + e − fanno lo zoom, i tasti freccia spostano, 0 riporta al 100% e F adatta il diagramma.