Update Sequence Diagram
When to use this skill
Use this skill when creating a new Mermaid sequence diagram or updating an existing one. This covers syntax for participants, messages, activations, notes, loops, alternative paths, and parallel actions.
Instructions
- Start with
sequenceDiagram: Every sequence diagram must start with this keyword. - Define Participants (Optional):
- Implicit:
Alice->>Bob: Hello John, how are you? - Explicit:
participant Aliceorparticipant A as Alice - Participant Types:
actor Alice(Stick figure)participant Alice @{ "type": "boundary" }participant Alice @{ "type": "control" }participant Alice @{ "type": "entity" }participant Alice @{ "type": "database" }participant Alice @{ "type": "collections" }participant Alice @{ "type": "queue" }- Note: Do not use
asalias and@{ "type": ... }simultaneously.
- Implicit:
- Actor Creation and Destruction:
- Create: Add
create participant <Name>before the message that creates it.create participant B A->>B: Hello - Destroy: Add
destroy <Name>before the message that destroys it.destroy B A->>B: Delete
- Create: Add
- Use Correct Message Syntax:
->Solid line without arrow-->Dotted line without arrow->>Solid line with arrowhead-->>Dotted line with arrowhead-xSolid line with a cross at the end--xDotted line with a cross at the end-)Solid line with an open arrow at the end (async)--)Dotted line with an open arrow at the end (async)
- Manage Activations:
- Explicit:
activate Alice...deactivate Alice - Shorthand:
Alice->>+Bob: Hello(activate Bob),Bob-->>-Alice: Hi(deactivate Bob)
- Explicit:
- Add Notes:
Note right of Alice: TextNote left of Alice: TextNote over Alice: TextNote over Alice,Bob: Text spanning both
- Control Flow:
- Loop:
loop Loop text ... end - Alt:
alt Describing text ... else ... end - Opt:
opt Describing text ... end - Par:
par [Action 1] ... and [Action 2] ... end - Critical:
critical [Action] ... option [Circumstance] ... end - Break:
break [something happened] ... end
- Loop:
- Multi-line Text: Use
<br/>instead of\nfor line breaks in messages and notes. - Background Highlighting:
rect rgb(0, 255, 0) ... endrect rgba(0, 0, 255, .1) ... end
- Sequence Numbers:
- Add
autonumberto the beginning of the diagram to automatically number messages.
- Add
Example
sequenceDiagram
autonumber
actor U as User
participant C as Client
participant S@{ "type": "control" }
participant Database@{ "type": "database" }
U->>C: Request Data
activate C
create participant T as Task
C->>T: Start Task
T-->>C: Task Started
destroy T
C->>T: Stop Task
C->>S: API Call
activate S
S->>Database: Query
activate Database
Database-->>S: Result
deactivate Database
S-->>C: Response
deactivate S
C-->>U: Display Data
deactivate C