How do I create a sequence diagram online?

Declare your participants (e.g. participant Browser) and describe each message between them with arrows like Browser->>Server: GET /api/users. The diagram is rendered instantly.

What is the difference between -> and -->>?

A solid arrow (->>) represents a synchronous message or request, while a dashed arrow (-->>) is typically used for responses or asynchronous messages.

Can I represent an actor (a person) instead of a system?

Yes, use the 'actor' keyword instead of 'participant', e.g. actor User, to render the participant as a stick figure.

Sequence diagram tool

Model the interactions between users, services and systems over time. Diagram.RS renders UML-style sequence diagrams live from simple Mermaid syntax – ideal for API flows, system design and software documentation.

Diagram code

Preview

Theme

Default

Try an example

How to create a sequence diagram online

Declare each participant with participant Name (or actor Name for a person).
Describe messages between participants using arrows, e.g. Browser->>Server: GET /api/users.
Use dashed arrows (-->>) for responses and solid arrows (->>) for requests.
Export the diagram once the flow looks right.

Sequence diagram FAQ

How do I create a sequence diagram online?: Declare your participants (e.g. participant Browser) and describe each message between them with arrows like Browser->>Server: GET /api/users. The diagram is rendered instantly.
What is the difference between -> and -->>?: A solid arrow (->>) represents a synchronous message or request, while a dashed arrow (-->>) is typically used for responses or asynchronous messages.
Can I represent an actor (a person) instead of a system?: Yes, use the 'actor' keyword instead of 'participant', e.g. actor User, to render the participant as a stick figure.

More diagram tools

Diagram maker home Flowchart maker ER diagram tool Mermaid live editor