Online Tool Store
Sequence Diagram Generator
Write participant and message lines in a simple text syntax and render a UML-style sequence diagram as SVG, ready to copy or download.
🔒 This tool runs entirely in your browser. Your files are never uploaded to a server.
How Sequence Diagram Generator works
- Write one message per line as
Sender->Receiver: label— a sample login flow is pre-filled and rendered immediately. - Every name that appears becomes a participant, placed in a column in the order it was first seen, with a dashed lifeline running down the diagram.
- Each message becomes a horizontal arrow between its two participants' lifelines, stacked top to bottom in the order you wrote them — solid for
->calls, dashed for-->replies. - Edit the textarea and the SVG redraws on every keystroke, so you can iterate on a flow quickly.
This mirrors the plain-text syntax used by tools like Mermaid and PlantUML for sequence diagrams — participants and message order come entirely from the arrows you write, with no separate diagram-editing step.
FAQ
What is the text syntax for a message?
Each line is "A->B: label" for a solid call arrow, or "A-->B: label" (with two dashes) for a dashed reply arrow — the same convention used by Mermaid and PlantUML sequence diagrams. Participants are discovered from the lines themselves, in the order they first appear.
Can I show a return value without writing a full reply?
Yes — just leave the label off ("API-->Browser:") or write a short one like "200 OK". Any line using the dashed arrow renders with a dashed line, which is the standard way UML sequence diagrams distinguish a call from its return.
Does the order of my lines matter?
Yes — messages render top to bottom in the exact order you write them, since that vertical order is what a sequence diagram exists to show. Participant columns are placed left to right by when each one is first mentioned, not alphabetically.
How we compare
| Feature | Online Tool Store | Doing it manually | A generic online tool |
|---|---|---|---|
| No file upload — runs in your browser | ✓ | N/A | ✗ |
| No sign-up required | ✓ | ✓ | ✗ |
| Free, no watermark | ✓ | ✓ | ✗ |
Full UML tools mean installing a desktop app or learning a diagramming suite just to sketch a call flow. This tool parses the same arrow syntax as Mermaid, right in the browser, and updates the SVG as you type — no install, no account, no rendering server.