Negócios / Diagramas

Criador de fluxogramas: visualização Mermaid e editor simples

Crie um fluxograma com texto Mermaid e visualização em tempo real. Adicione nós de processo, decisão, início-fim e entrada-saída, conecte-os com rótulos ou comece com um dos três modelos originais.

Criador de fluxogramas: visualização Mermaid e editor simples: Escreva um fluxograma em texto Mermaid ou use o editor para adicionar etapas, decisões e conexões, acompanhando a atualização do diagrama enquanto você digita. Comece com um exemplo, copie o texto ou baixe o fluxograma em SVG ou PNG. Roda 100% localmente no seu navegador, sem enviar nenhum arquivo para o servidor.

Categoria: Ferramentas para negócios e administração
Execuções: No seu navegador
Custo: Grátis · sem cadastro
Disponibilidade: Pronto para usar

Criador de fluxogramasProcessamento local

Roda inteiramente no seu navegador

Texto do fluxograma Mermaid

flowchart TD
N1(["Start"]) --> N2["Prepare a draft"]
N2 --> N3["Review the draft"]
N3 --> N4(["Finish"])

Criador simples

Rótulo do nóForma

ID do nó de origemID do nó de destino

Rótulo da conexão

A prévia é atualizada enquanto você digita. O criador acrescenta instruções ao seu texto. Diretivas de configuração, estilos personalizados e manipuladores de clique estão desativados.

Renderizando prévia…

Usar as cores da prévia nos arquivos exportados

Sintaxe de fluxogramas

A linguagem de fluxogramas do Mermaid aceita nós, arestas e decisões rotuladas. Esta ferramenta aceita a parte de fluxogramas dessa linguagem; o construtor adiciona novas linhas ao final do seu texto. Sintaxe oficial: https://mermaid.js.org/syntax/flowchart.html

Segurança e licença

Os diagramas são desenhados no seu navegador com o Mermaid, uma biblioteca de código aberto licenciada sob a licença MIT, no modo de segurança estrito: HTML nos rótulos, ações de clique e blocos de configuração não são permitidos, portanto um diagrama colado não pode executar código. Configuração oficial de segurança: https://mermaid.js.org/config/schema-docs/config-properties-securitylevel.html

Como usar

Escolha um modelo de processo, árvore de decisão ou login, ou escreva o texto do fluxograma em Mermaid.
Adicione um nó com o editor e conecte IDs de nós existentes, com a opção de atribuir um rótulo à conexão.
Corrija os erros de sintaxe indicados e baixe o SVG, PNG ou texto Mermaid.

Privacidade e limitações

O texto Mermaid é processado somente no seu navegador. Nada é enviado ou salvo no armazenamento local. Diretivas de configuração, callbacks, imagens e recursos externos são desativados.

Ferramentas relacionadas

Perguntas frequentes

Como o editor nomeia os nós?

Ele usa o próximo ID N-number disponível. Para conectar nós, insira no texto os IDs correspondentes. O editor codifica com segurança aspas, colchetes e outras pontuações dos rótulos.

Posso usar todos os tipos de diagramas Mermaid?

Esta ferramenta aceita somente a sintaxe de fluxograma ou grafo. Para outros tipos de diagrama, use o editor Mermaid existente.

Como os erros são exibidos?

Os erros do analisador mostram o número da linha quando o Mermaid fornece essa informação. Erros de segurança e de limite de entrada exibem uma mensagem separada.

Os modelos foram copiados de outro lugar?

Não. O processo simples, a árvore de decisão e o fluxo de login são exemplos curtos originais, escritos para esta ferramenta.

Ferramenta grátis · no seu navegador execuções · não precisa de conta