DevToy

Editor de Diagramas Mermaid

Escreva, valide e exporte diagramas localmente.

Carregando renderizador

Editor de Código Mermaid

Visualização em Tempo Real

No diagram to render.

O que é Mermaid?

Mermaid transforma definições de texto em diagramas. As equipes podem revisar a fonte em pull requests, acompanhar mudanças com Git e manter os diagramas junto à documentação.

O editor renderiza localmente fluxogramas, sequências, classes, relações de entidades e gráficos de Gantt. Comece com um modelo e exporte SVG ou PNG.

Escolha o diagrama certo

  • Fluxogramas explicam decisões e processos.
  • Diagramas de sequência mostram mensagens ao longo do tempo.
  • Diagramas ER documentam entidades e relações.
  • Diagramas de classe descrevem tipos e herança.
  • Gráficos de Gantt comunicam cronogramas.

Fluxograma mínimo

flowchart LR
  Pedido --> Validar{Válido?}
  Validar -->|Sim| Publicar
  Validar -->|Não| Revisar

Renderização local segura

A fonte fica no localStorage e não é enviada pelo DevToy. Mermaid usa o modo de segurança estrito.

Perguntas frequentes

Qual formato devo exportar?

Use SVG para documentação e PNG quando o destino não aceitar SVG.

Por que uma sintaxe aparentemente válida falha?

Confira a palavra inicial, indentação, palavras reservadas, aspas e a versão do Mermaid.

O diagrama é salvo?

A fonte atual é salva neste dispositivo e removida ao limpar o armazenamento do navegador.