Veja diagramas Mermaid no seu Mac sem navegador

Um arquivo Mermaid é só texto até alguém desenhá-lo, e o Gander o desenha direto na Visualização Rápida: selecione um arquivo .mmd no Finder, pressione a barra de espaço e o diagrama aparece, com o código a um clique. Blocos Mermaid dentro de arquivos Markdown também são desenhados.

Grátis, sem compras dentro do app. Para macOS 15 ou posterior. Feito por 65FN LLC.

roadmap.mmd como gráfico de Gantt: o roadmap do Nimbus 3.0 com barras agrupadas por seção.
branches.mmd como gráfico do git com os branches main e radar-v2, commits de merge e a tag v2.4.0.
architecture.mmd como diagrama de sequência: um usuário, um app para iOS, a Forecast API e o Postgres trocando requisições.

Como fazer

  1. Instale o Gander pela Mac App Store e abra-o uma vez.

  2. Selecione um arquivo .mmd ou .mermaid no Finder e pressione a barra de espaço.

  3. Alterne entre Diagrama e Código. O botão de copiar copia uma imagem do diagrama ou o texto do código.

Os diagramas que os desenvolvedores usam

O Gander desenha estes tipos de diagrama Mermaid:

  • Fluxogramas e diagramas de sequência, de classes, de estados e entidade-relacionamento
  • Gráficos de Gantt, linhas do tempo e jornadas do usuário
  • Gráficos do git, mapas mentais, gráficos de pizza, gráficos de quadrantes e gráficos XY
  • Diagramas C4 e de requisitos

Dentro do Markdown também

Em um README, um bloco de código cercado marcado como mermaid é desenhado como diagrama dentro da página renderizada. Quando você exporta o Markdown para PDF, o diagrama vai junto como um desenho vetorial, que continua nítido em qualquer zoom.

Desenhados no seu Mac

Os diagramas são desenhados de forma nativa, sem navegador, sem serviço web e sem conexão com a internet, então funcionam offline e nada sobre a sua arquitetura sai do seu Mac. Nas visualizações por ícones e galeria do Finder, os arquivos Mermaid ganham uma miniatura do código.

Perguntas

Quais arquivos o Gander abre como Mermaid?

Arquivos .mmd e .mermaid. Em arquivos Markdown, um bloco de código cercado marcado como mermaid é desenhado como diagrama.

Preciso do Node.js ou da Mermaid CLI?

Não. O Gander desenha os diagramas sozinho, e não é preciso instalar mais nada.

Ainda consigo ler o código Mermaid?

Sim. A aba Código mostra o arquivo como foi escrito, com números de linha quando você quiser.

Experimente nos seus arquivos

O Gander é grátis na Mac App Store, sem compras dentro do app, sem assinatura e sem conta, e nada do que você pré-visualiza sai do seu Mac.