ai-agent

web-sequence

Realtime tool for generating sequence diagrams.
150 stars28 forksJavaScriptUpdated 10/22/2026100% free · open source
What it does

Generates live, interactive sequence diagrams from plain‑text descriptions in your browser.

When to use it
  • •You need a quick visual of a system flow for a pitch deck or sprint planning.
  • •Your team is collaborating on API call sequences and wants an instant, shareable diagram.
  • •You want to embed up‑to‑date sequence diagrams in documentation without manual drawing.
Ready-to-paste prompt
participant Client
participant Service
participant DB
Client->Service: GET /orders?user=42
Service->DB: SELECT * FROM orders WHERE user_id=42
DB->Service: rows
Service->Client: 200 OK {orders}
Heads up: The project requires Node >=18; using an older Node version will cause the dev server to crash (the README warns about this).
Saves to your device
Use with Claude
New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install
Claude Code
mkdir -p ~/.claude/skills/web-sequence && curl -fsSL https://workflowstacks.com/api/skills/web-sequence/claude-skill -o ~/.claude/skills/web-sequence/SKILL.md
Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)
claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

What's inside — free to inspect

No purchase needed

Read the entire source before you build — unlike paid marketplaces that hide it behind a buy button.

44
top-level files
18
folders
129.0M
source size
MIT
license
Key files
.editorconfig
firestore.indexes.json
index.html
main.js
package.json
playwright.config.js
File tree
.claude/
.github/
.storybook/
.vscode/
docs/
e2e/
End-User-License-Agreement/
functions/
git-hooks/
help/
icons/
privacy-policy/
screenshots/
scripts/
src/
static/
uninstall/
web/
.babelrc
.editorconfig
.eslintrc.json
.firebaserc
.git-blame-ignore-revs
.gitignore
Quick Actions
Details
Creator
ZenUml
Language
JavaScript
Category
ai-agent
Published
9/30/2017

Are you the creator of this tool? and earn 85% of every sale.

Show it off in your README:

Featured on WorkflowStacks
[![Featured on WorkflowStacks](https://workflowstacks.com/api/badge/web-sequence.svg)](https://workflowstacks.com/skills/web-sequence?utm_source=github&utm_medium=badge)
🔥 Hot this week, in your inbox
Skills like this, every Monday.

The five fastest-growing open-source AI skills, ranked by GitHub star growth. One email a week, unsubscribe anytime.