Pular para o conteúdo principal

Mermaid 11.15.0

Guia rápido de diagramas de sequência no Mermaid

Diagramas de sequência mostram mensagens entre participantes. Use fluxogramas para decisões ou diagramas de classes para estruturas estáticas.

Criar com o Gerador de diagramas de sequência →

Início rápido

Declare os aliases antes das mensagens para definir a ordem das linhas de vida.

Mermaid
Abrir no editor → 
sequenceDiagram
  actor R as Leitor
  participant S as Serviço de busca
  R->>+S: Buscar guia
  S-->>-R: Retornar resultados

Carregando…

Referência de sintaxe

Referência de sintaxe
SintaxeSignificado
sequenceDiagram / participant / actor / asDeclara linhas de vida e aliases; actor usa um símbolo de pessoa.
participant A@{ "type": "boundary" }Tipos: boundary, control, entity, database, collections e queue; participant e actor atendem aos casos básicos.
->Linha contínua sem ponta
-->Linha tracejada sem ponta
->>Seta contínua
-->>Seta tracejada
<<->>Seta bidirecional contínua
<<-->>Seta bidirecional tracejada
-xLinha contínua com cruz
--xLinha tracejada com cruz
-)Seta aberta contínua, assíncrona
--)Seta aberta tracejada, assíncrona
-|\Variante de meia seta; o exemplo mostra a orientação e o traço.
--|\Variante de meia seta; o exemplo mostra a orientação e o traço.
-|/Variante de meia seta; o exemplo mostra a orientação e o traço.
--|/Variante de meia seta; o exemplo mostra a orientação e o traço.
/|-Variante de meia seta; o exemplo mostra a orientação e o traço.
/|--Variante de meia seta; o exemplo mostra a orientação e o traço.
\\-Variante de meia seta; o exemplo mostra a orientação e o traço.
\\--Variante de meia seta; o exemplo mostra a orientação e o traço.
-\\Variante de meia seta; o exemplo mostra a orientação e o traço.
--\\Variante de meia seta; o exemplo mostra a orientação e o traço.
-//Variante de meia seta; o exemplo mostra a orientação e o traço.
--//Variante de meia seta; o exemplo mostra a orientação e o traço.
//-Variante de meia seta; o exemplo mostra a orientação e o traço.
//--Variante de meia seta; o exemplo mostra a orientação e o traço.
A->>()B / A()->>B / A()->>()BConecta mensagens ao centro da linha de vida de origem ou destino.
activate / deactivate / ->>+ / -->>-Inicia e encerra ativações; mantenha ativações aninhadas equilibradas.
create participant / create actor / destroyCrie antes da primeira mensagem recebida e destrua antes da mensagem final.
Note left of / right of / over A,BPosicione notas ao lado ou sobre linhas; <br/> insere quebras.
loop / alt / else / opt / par / and / critical / option / break / rect / endFeche cada bloco com end; else, and e option pertencem aos blocos correspondentes. rect recebe uma cor.
autonumber / autonumber 10 5Numera mensagens; aceita início e incremento.
box Color Label / endAgrupa declarações de participantes em caixas coloridas ou transparentes.
link A: Label @ URL / links A: {"Label":"URL"}Adiciona um link ou menu JSON ao participante.
%% / accTitle: / accDescr:Comentários e descrições acessíveis.

Participantes e aliases

Ids curtos identificam participantes; aliases contêm texto visível. A configuração JSON muda o símbolo. Declare as linhas antes de enviar mensagens.

Mermaid
Abrir no editor → 
sequenceDiagram
  actor R as Leitor
  participant B@{ "type": "boundary" }
  participant C@{ "type": "control" }
  participant E@{ "type": "entity" }
  participant D@{ "type": "database" }
  participant L@{ "type": "collections" }
  participant Q@{ "type": "queue" }
  R->>B: Solicitação
  B->>C: Validar
  C->>E: Ler
  E->>D: Consulta
  D-->>L: Resultados
  L-)Q: Notificar

Carregando…

Tipos de seta

Escolha setas conforme sua convenção. Setas abertas costumam indicar envio assíncrono; uma cruz não encerra a linha de vida sem destroy.

Mermaid
Abrir no editor → 
sequenceDiagram
  participant A as Emissor
  participant B as Receptor
  A->B: Mensagem
  A-->B: Mensagem
  A->>B: Mensagem
  A-->>B: Mensagem
  A<<->>B: Mensagem
  A<<-->>B: Mensagem
  A-xB: Mensagem
  A--xB: Mensagem
  A-)B: Mensagem
  A--)B: Mensagem
  A-|\B: Mensagem
  A--|\B: Mensagem
  A-|/B: Mensagem
  A--|/B: Mensagem
  A/|-B: Mensagem
  A/|--B: Mensagem
  A\\-B: Mensagem
  A\\--B: Mensagem
  A-\\B: Mensagem
  A--\\B: Mensagem
  A-//B: Mensagem
  A--//B: Mensagem
  A//-B: Mensagem
  A//--B: Mensagem
  A()->>()B: Conexão central

Carregando…

Criação e ativação

create precede imediatamente a mensagem de criação e destroy a mensagem final. Equilibre as ativações.

Mermaid
Abrir no editor → 
sequenceDiagram
  participant C as Controlador
  create participant W as Trabalhador
  C->>+W: Iniciar trabalho
  Note right of W: Processo temporário
  W-->>-C: Trabalho concluído
  destroy W
  C-xW: Parar processo

Carregando…

Blocos de controle

Feche blocos com end. else separa alternativas, and ramos paralelos e option recuperações de critical. break representa uma saída excepcional.

Mermaid
Abrir no editor → 
sequenceDiagram
  participant C as Cliente
  participant S as Serviço
  loop Nova tentativa
    C->>S: Solicitação
    alt Aceito
      S-->>C: Resultado
    else Rejeitado
      S-->>C: Erro
    end
  end
  opt Cache disponível
    S-->>C: Resultado em cache
  end
  par Registro
    S->>S: Registrar
  and Métricas
    S->>S: Contar
  end
  critical Confirmação
    S->>S: Salvar
  option Falha
    S-->>C: Reverter
  end
  break Tempo esgotado
    S-->>C: Parar
  end
  rect rgb(230,240,255)
    Note over C,S: Limite da revisão
  end

Carregando…

Opções de apresentação

mirrorActors repete participantes no rodapé; wrap ajusta mensagens e actorMargin separa linhas de vida. A ordem das mensagens permanece.

Mermaid
Abrir no editor → 
---
config:
  sequence:
    mirrorActors: false
    wrap: true
    actorMargin: 60
---
sequenceDiagram
  participant R as Leitor
  participant G as Guia
  R->>G: Ler referência

Carregando…

Erros comuns

Deixar um bloco aberto

Adicione end para cada bloco aninhado.

Sintaxe inválida: veja a correção abaixo

sequenceDiagram
  loop Nova tentativa
    A->>B: Solicitação
Mermaid
Abrir no editor → 
sequenceDiagram
  loop Nova tentativa
    A->>B: Solicitação
  end

Carregando…

Usar end como texto solto

end é especial; use aspas ou colchetes se houver ambiguidade e evite ids reservados.

Limitações

  • O layout controla posições horizontais; linhas de vida não são arrastáveis livremente.
  • As mensagens seguem o código, sem escala temporal numérica.
  • Menus dependem do ambiente que incorpora o diagrama.

Perguntas frequentes

Qual a diferença entre actor e participant?
actor desenha uma pessoa; participant normalmente desenha uma caixa e admite outros símbolos. Ambos trocam mensagens.
Como desenhar uma resposta?
Use -->> para uma resposta tracejada; acrescente menos para também encerrar uma ativação.
Como mostrar trabalho simultâneo?
Use par com ramos separados por and e feche com end.