Diagramium

The sequence diagram maker that draws what you type

Write Alice->Bob: Hello, get lifelines and activation bars instantly — then press Present and watch the flow explain itself.

Present reveals your sequence diagram one step at a time, on its own.

Live interactive diagramUse the player controls to follow the steps
The TLS 1.3 handshake — the finished diagram this player draws step by step
The TLS 1.3 handshakePlaying silently in this guideWatch with narrationOpen in editor
This compact player stays quiet while you read. Open the full presentation when you want narration and the complete walkthrough.

Diagramium is a free sequence diagram maker that turns plain text into a finished diagram: type Alice->Bob: Hello and the participants, lifelines, and message arrow exist. Unlike a static drawing tool, the result can present itself — press Present and the flow reveals one message at a time with optional voice narration — the live TLS-handshake example on this page is that flow in motion.

It is built for the flows developers actually draw: API request cycles, auth handshakes, incident writeups. You type the interaction the way you would describe it in a pull request, and when text alone is not enough, the same diagram is fully editable by drag and drop. Everything runs in your browser, with no sign-up and nothing uploaded.

Type a line, get a message

In Diagramium, one line of text is one message: Alice->Bob: Hello draws two participants, their lifelines, and a labeled arrow between them. Keep typing and the flow grows line by line — the diagram redraws as you write, so a working draft of an entire request cycle takes about as long as describing it in a code review comment.

Text is the fast path, not the only path. Everything the text creates can also be edited visually: drag to fine-tune the layout, pin notes beside a lifeline, and wrap steps in alt, loop, or opt fragments where the flow branches or repeats. For a start-to-finish walkthrough, see how to create a sequence diagram.

Sequence diagram notation in plain terms

A sequence diagram shows who talks to whom, in what order: participants sit across the top, time flows down the page, and each arrow is one message. Five elements carry almost all of the meaning:

Reach for a sequence diagram when the interesting part is the interaction between parties over time; reach for a flowchart when the interesting part is decision logic inside one process. Sequence diagrams explained goes deeper into reading and writing the notation.

Built for API flows, auth flows, and incident writeups

The flows developers explain most often — a request crossing three services, an OAuth handshake, the chain of calls behind an outage — are sequence diagrams by nature. Type the calls in the order the logs show them and the diagram is the writeup: an auth flow becomes a dozen lines of text, an incident timeline becomes a picture reviewers can follow without re-reading the ticket.

Then let it present itself. Press Present and the flow reveals one message at a time, with an optional AI voice, subtitles with word-by-word highlighting, a spotlight on the current step, and per-step speaker notes for the "why this matters" behind each call — useful for onboarding a new teammate or walking a room through a postmortem. The Explore gallery holds ready-made, editable examples, and any diagram published there can be embedded on another site as a self-playing iframe.

From first line to shared flow

  1. Open the sequence diagram editor. No account, nothing to install.
  2. Type your first message — Alice->Bob: Hello — and watch the participants and lifelines appear.
  3. Add the rest of the flow, one line per message, in the order the calls happen.
  4. Wrap branching or repeating steps in alt, loop, or opt fragments, and pin notes where a reader needs context.
  5. Fine-tune visually: apply a theme or restyle a message, such as the hand-drawn Doodle pencil sketch.
  6. Press Present to check the step-by-step reveal, and add speaker notes for narration.
  7. Export a PNG or SVG for free. A free account unlocks animated GIF, video, and animated SVG — or record the presentation live.

Local-first and private

Your diagrams never leave your device. Diagramium is local-first: sequence diagrams live in your browser and in the files you export, no feature uploads diagram content, and the editor keeps working offline once loaded. The app carries no ads and no third-party analytics; the only thing counted is an anonymous per-diagram tally, and diagram content is never part of it. For an API flow that names your internal services, that matters.

Frequently asked questions

Is the sequence diagram maker free? Do I need an account?

Diagramium's sequence diagram maker is free, and you do not need an account to draw, present, or export PNG and SVG stills. A free account unlocks the animated export formats. There is no paid tier.

What formats can I export a sequence diagram to?

Every sequence diagram exports to PNG and SVG with no account. Animated GIF, video, and animated SVG exports unlock with a free account, and you can also record a live run of the presentation.

Does it work offline, and where are my diagrams stored?

Diagramium is local-first: your sequence diagrams live on your device and in the files you export, and no feature uploads diagram content. Once the app has loaded, the editor keeps working without a connection.

How does the text syntax work?

One line is one message: Alice->Bob: Hello creates the participants Alice and Bob, their lifelines, and a labeled arrow between them. Keep typing lines to extend the flow, and add alt, loop, and opt fragments where the flow branches or repeats. Everything the text creates can also be edited visually.

Can a sequence diagram show if/else logic and loops?

Yes — UML fragments handle this in a sequence diagram: an alt fragment holds alternative branches (if/else), a loop fragment marks messages that repeat, and an opt fragment marks a step that may not happen at all. Diagramium supports all three, plus notes for extra context.

When should I use a sequence diagram instead of a flowchart?

Use a sequence diagram when the point is the conversation between participants — services, clients, people — in time order, such as an API call chain or an auth handshake. Use a flowchart when the point is the decision logic inside a single process. Diagramium includes editors for both.

More diagram makers

A flowchart maker that walks its own path · A mind map maker that turns brainstorms into walkthroughs · An architecture diagram maker that walks the request path · A UML diagram maker that walks through your design · An ER diagram maker that presents your schema step by step · A data flow diagram maker that presents the path data takes · The animated diagram maker where diagrams explain themselves · An AI Diagram Maker for the Assistant You Already Use · A free timeline maker for roadmaps, launches, and history · The Gantt Chart Maker That Explains Your Schedule · Software release plan maker: from code freeze to hotfix lane · RASCI matrix maker: one lane per role, every hand-off explicit · A free org chart maker that presents itself level by level · A free Venn diagram maker where the overlap is the point · A free process map maker for the way work actually runs · A free state machine diagram maker that walks every transition · A free concept map maker where every link says what it means · A free customer journey map maker that shows where it hurts · A free decision tree maker where every path reaches an answer · A free fishbone diagram maker for finding the actual cause · A free network diagram maker that keeps your topology private · A free use case diagram maker that shows who can do what · A free threat model maker that stays on your machine · A free C4 model maker, one level at a time · A free BPMN diagram maker for processes two teams must agree on · A free kanban board maker for explaining how work flows · A free sitemap diagram maker for planning a site's structure