OpenFlowKit

The open-source diagramming studio for builders.

Create flows from templates, code, structured imports, or AI. Refine them visually, keep them local-first, and export as Cinematic MP4 walkthroughs — or drive everything from Claude / Cursor / Windsurf via our first-party MCP server.

→ Launch the App   |   Documentation   |   Website   |   Issues   |   Contribute

✨ Mermaid → Icons Paste Mermaid · 1,600+ icons auto-assigned · beautiful	🤖 AI Generation 10 providers inc. local Ollama Direct-to-canvas output	`{}` Diagram as Code Bidirectional live sync Git-friendly DSL	🧩 Asset Libraries Developer · AWS · Azure GCP · CNCF · Icons	🎬 Cinematic MP4 WebCodecs H.264 Faster-than-realtime
🧷 Anchored Layout Pin nodes — auto-layout rearranges around them	🪄 MCP Server Drive from Claude Desktop, Cursor, Windsurf	⚡ Worker Layout ELK runs off main thread UI stays responsive	🦙 Local AI Ollama localhost preset fully offline diagramming	♻️ Self-Correcting AI Bad DSL → AI sees its own output and repairs it

See it in action

Why OpenFlowKit?

Every diagramming tool makes a compromise. OpenFlowKit doesn't.

OpenFlowKit is the only MIT-licensed tool that combines a real workspace home, a professional visual canvas, bidirectional diagram-as-code, AI generation from 10 providers (including fully-local Ollama), automatic icon assignment from 1,600+ tech icons, anchored auto-layout, hardware-encoded cinematic MP4 export, and a Model Context Protocol server so Claude / Cursor / Windsurf can drive it directly — all with zero server-side storage.

Feature highlights

Paste Mermaid → Beautiful Diagrams

Paste any Mermaid flowchart, architecture, state diagram, class diagram, ER diagram, sequence diagram, mindmap, or journey — all 8 diagram families. OpenFlowKit renders it on a visual canvas and automatically assigns the correct branded icon to every technology node.

flowchart TD
  API[Express API] --> DB[(PostgreSQL)]
  DB --> Cache[Redis Cache]
  Cache --> Queue[RabbitMQ]

Paste this → you get the Express wordmark, PostgreSQL elephant, Redis logo, and RabbitMQ icon — all auto-detected, all beautifully laid out. No other tool does this.

1,600+ icons from developer, AWS, Azure, CNCF, and GCP catalogs are matched automatically based on node labels. No manual drag-and-drop. No configuration.

How it works

1. Paste Mermaid on the canvas or in the code panel
2. Semantic classifier detects technology names (PostgreSQL, Redis, Express, Lambda, etc.)
3. Icon matcher searches 1,600+ icons across all catalogs — exact match, then alias, then substring
4. Enricher assigns colors, icons, and provider SVGs to every node
5. ELK layout arranges everything cleanly

Mermaid quality gates

• npm run test:mermaid runs the broad Mermaid parser/plugin/round-trip gate
• npm run test:mermaid:layout runs the layout, import-state, and recovery corpus gate
• npm run test:mermaid:gold runs both together

AI generation (API key required)

Describe your system in plain English. AI generates a diagram on the canvas with correct icons applied automatically.

10 providers supported: Google Gemini, OpenAI, Anthropic Claude, Groq, Mistral, NVIDIA NIM, Cerebras, OpenRouter, Ollama (fully local), or any custom OpenAI-compatible endpoint. Bad DSL from any provider is now auto-repaired — the model sees its own broken output and the parser error, then returns corrected DSL in a single follow-up turn.

Home first, editor second

OpenFlowKit now treats the product as two clear surfaces:

• Home for creating, opening, duplicating, importing, and organizing flows
• Editor for actual canvas work once a real document exists

That means the app does not create a fake default flow just to get you onto the canvas. If you delete everything, your workspace can stay empty until you intentionally create the next flow.

Flowpilot — AI generation with any model

Flowpilot sits directly in the editor. Describe a system, paste source code, upload a screenshot, or ask it to refine what's already on the canvas. Your API key is stored in your browser and sent directly to the provider — OpenFlowKit's servers never see it.

10 providers. Bring your own key. Switch any time. One runs entirely on your laptop.