Sequence Diagram

Free Online Sequence Diagram Maker

Create UML sequence diagrams to visualize interactions between systems, services, and users. Real-time preview, no signup.

Try it live

sequenceDiagram
    actor U as User
    participant App
    participant Auth as Auth Service
    participant DB as Database

    U->>App: Submit login form
    App->>Auth: POST /authenticate
    activate Auth
    Auth->>DB: Query user credentials
    DB-->>Auth: User record
    Auth-->>App: JWT token
    deactivate Auth
    App-->>U: Redirect to dashboard

    Note over App,Auth: Token valid for 24h

When to use sequence diagram

API documentation

Document REST API calls, authentication flows, and service-to-service communication.

System design

Visualize microservice interactions, message passing, and event-driven architectures.

Bug investigation

Map out the sequence of events leading to an issue to identify where failures occur.

Key syntax

sequenceDiagramDeclare diagram type
participant ADeclare a participant
actor U as UserParticipant shown as person icon
A->>B: messageSolid arrow with message
A-->>B: replyDashed reply arrow
activate AShow activation bar
Note over A,B: textAdd note spanning participants
loop Every 5sLoop block
alt/elseConditional block

How to create a sequence diagram with Mermaid

1

Open FlowViz and start with sequenceDiagram on the first line.

2

Declare your participants: participant Server or actor User for people.

3

Write messages between participants: A->>B: Request message for solid arrows.

4

Use A-->>B: Response for dashed reply arrows.

5

Add activate A and deactivate A to show processing time bars.

6

Use Note over A,B: text to add annotations.

7

Export as SVG when your diagram is complete.

Related tools

Meeting Cost Calculator →

Start diagramming now

No signup. No install. Just open the editor and start writing.