Sketch how something works — a system, a process, a customer journey — then present it one step at a time, and share it as a link anyone can walk through themselves.
No account needed · Walk through flows on your phone, build them on a desktop No account needed to try · Build, share, then save
A live diagram, not a screenshot — scroll down and step through it yourself. Every shared diagram embeds like this, one iframe, any site.
From blank canvas to a fully walkable flow in minutes.
Pick from Frontend, Service, Database, Cache, Queue, External API — or create a custom component. Place them on the canvas.
Draw arrows between components in the order they happen. Label each one — "POST /login", "returns JWT", "cache miss". Multiple interactions between the same pair are fine.
Hit Next to step through each interaction one at a time. The active step lights up, the rest fades. Perfect for design reviews, onboarding, and interviews.
No fuss. No bloat. Just the tools that matter for system design.
Paste plain A -> B: action lines and the canvas builds itself.
Send a link and collect the feedback in one place. Reviewers comment by name without needing an account, so an async design review doesn't have to become a meeting.
One click to generate a public read-only link. Anyone can step through your flow without needing an account.
Drop a single <iframe> into Notion, Confluence, your blog — the full interactive walkthrough lives there.
A dedicated notes panel for trade-offs, open questions, and findings — saved alongside the diagram so context never gets lost.
Every change auto-saves to the cloud. Pick up exactly where you left off from any device, no manual saving required.
Flostep speaks the Model Context Protocol, so Claude, Cursor, VS Code and Windsurf can build diagrams for you — from a description, or straight from the codebase they're already looking at.
claude mcp add --transport http \
flostep https://flostep.dev/mcp \
--header "Authorization: Bearer fls_…"
One command for Claude Code, or a few lines of JSON for any other MCP client.
“Make a Flostep diagram of how password reset works here, and give me a share link.”
“Add a retry step between the queue and the worker.”
It reads your existing diagrams too, so edits land on the real thing — not a guess at it.
Walk an interviewer through your design component by component instead of pointing at a static blob.
A refund, an escalation, an approval chain — show who does what, in order, instead of writing it out as a wall of numbered steps.
Embed a live walkthrough in your handbook or onboarding docs, and let people step through it at their own pace.
Share a link, let teammates leave comments on specific steps, and iterate without scheduling another meeting.
Everything you need to know before your first flow.
No. Hit “Try it now” and start building immediately — your diagram lives in your browser. Create a free account when you want to save it permanently and get a stable share link.
System design flows — drag Frontend, Service, Database, Cache, Queue, and External API components (or custom ones), connect them in the order interactions happen, label each step, then walk through it one hop at a time.
One click generates a public, read-only link. Anyone can step through your flow interactively — no account needed. You can also embed the full walkthrough in Notion, Confluence, or your docs with a single iframe.
Yes. Paste plain A -> B: action lines into the Code view and the canvas builds itself.
Yes. Flostep is an MCP server, so any assistant that speaks the Model Context Protocol — Claude, Cursor, VS Code, Windsurf — can create, read, edit, and share your diagrams. Create an API key, connect it once, then ask in plain language. See the MCP guide.
You can open, pan, zoom and step through any diagram or shared link on a phone — that's the part people are usually sent. Building and editing need a desktop, where there's room for the canvas and the component palette.
There's a genuinely free plan, and a Pro plan for unlimited diagrams and more. See the pricing page for the full breakdown.
Free to start. No credit card. Build your first flow in under two minutes.
Create a free account