Conversor online gratuito de MERMAID para PNG

PNG é útil quando um diagrama Mermaid precisa ser inserido em um documento, apresentação, rastreador de issues ou arquivo baseado em imagens que não pode renderizar o código-fonte Mermaid. A conversão também cria um instantâneo visual fixo para compartilhamento, enquanto o arquivo Mermaid original permanece editável.

O que é o formato MERMAID

Um arquivo MERMAID é uma definição de diagrama em texto simples, geralmente salva com a extensão .mermaid ou .mmd. Ele contém a sintaxe Mermaid para fluxogramas, mapas mentais, diagramas de sequência, diagramas de classes, diagramas de estados, diagramas de entidade-relacionamento e outros gráficos estruturados, em vez de pixels armazenados.

Os arquivos Mermaid são criados ou editados no Mermaid Live Editor, Mermaid CLI, Visual Studio Code com extensões Mermaid e aplicativos como Obsidian, GitLab e GitHub que oferecem suporte à renderização Mermaid. Você pode encontrar um desses arquivos quando um diagrama é armazenado em um repositório de código-fonte, documento Markdown, aplicativo de anotações ou projeto de documentação.

O que é o formato PNG

PNG é um formato de imagem raster compatível com navegadores da web, software de escritório, ferramentas de apresentação, visualizadores de imagens e a maioria dos sistemas de documentos. Ele usa compressão sem perdas, preserva linhas e textos nítidos de cores sólidas melhor que JPEG e pode armazenar fundos transparentes.

PNG é adequado quando o destinatário precisa de uma imagem comum em vez da sintaxe Mermaid. Ele não é ideal para editar elementos individuais do diagrama ou para diagramas extremamente grandes, pois ampliar uma imagem raster pode fazer com que textos e linhas pareçam pixelados.

Como converter MERMAID para PNG

Usando o 101convert online

1. Abra o conversor de MERMAID para PNG em 101convert.com.
2. Carregue o arquivo .mermaid ou .mmd.
3. Inicie a conversão e baixe o arquivo .png gerado.

Essa opção não exige software instalado e é adequada quando o arquivo Mermaid não contém informações confidenciais.

Usando o Mermaid CLI

Para conversões locais repetíveis, instale o Mermaid CLI com Node.js:

npm install -g @mermaid-js/mermaid-cli

Renderize um arquivo de origem com:

mmdc -i diagram.mermaid -o diagram.png

A entrada também pode usar a extensão .mmd. Para aumentar a resolução raster, aplique um fator de escala:

mmdc -i diagram.mmd -o diagram.png -s 2

Use uma cor de fundo quando a transparência não for adequada:

mmdc -i diagram.mmd -o diagram.png -b white

O Mermaid CLI renderiza o código-fonte com um navegador headless. Se a instalação informar um problema com Chromium ou com o navegador, siga as instruções de configuração do navegador correspondentes à versão do Mermaid CLI antes de executar o comando novamente.

Usando um editor de diagramas

Abra o código-fonte no Mermaid Live Editor ou em outro editor compatível com Mermaid, verifique se a visualização é renderizada corretamente e escolha Export → PNG ou o comando equivalente de exportação de imagem. As configurações de exportação podem permitir um fundo transparente, a seleção de um tema ou o ajuste da escala.

Considerações sobre qualidade e compatibilidade

O PNG reflete o renderizador Mermaid, a versão do Mermaid, o tema, as fontes disponíveis e quaisquer configurações de inicialização usadas durante a exportação. Portanto, um diagrama pode ter uma aparência diferente quando renderizado por outro aplicativo ou versão.

Aumente a escala de exportação para diagramas que contenham rótulos pequenos; alterar a largura do PNG após a exportação não restaura detalhes perdidos. Mantenha o código-fonte Mermaid original junto com o PNG, pois o PNG não preserva nós, links, regras de layout ou texto editável.

Se o destino for compatível com gráficos vetoriais, SVG geralmente é melhor para diagramas grandes e redimensionamentos posteriores. Escolha PNG quando o aplicativo de destino aceitar apenas imagens raster ou quando for necessária uma imagem de tamanho fixo.