Skip to content
OpenFlowKit OpenFlowKit Docs

Introduction

OpenFlowKit is a local-first diagramming workspace for developers and builders. Its strongest path is simple: start from the most truthful input you already have, turn it into an editable diagram, then refine it visually instead of redrawing everything from scratch.

Best reasons to use it

Section titled “Best reasons to use it”

OpenFlowKit works best when a diagram needs to evolve instead of staying static:

  • start from code, Mermaid, SQL, OpenAPI, Terraform, infrastructure files, or a strong starter template
  • convert that source into an editable first draft instead of a dead export
  • refine the result visually instead of treating generation as a one-shot output
  • keep a text representation close to the editor model when needed
  • export or share the same diagram across docs, design, and collaboration workflows

Strongest starting paths

Section titled “Strongest starting paths”

If you are evaluating OpenFlowKit quickly, start with one of these:

  • paste SQL or OpenAPI and generate a structured first draft
  • import Terraform, Kubernetes, or other infra-oriented source text
  • paste Mermaid or OpenFlow DSL and keep editing on the canvas
  • start from a developer-oriented template when structure matters more than exact content
  • use Flowpilot when you need a fast architecture draft from code or a prompt

Core product surfaces

Section titled “Core product surfaces”

The current product centers on four major surfaces:

  • A workspace home for creating, opening, importing, and organizing flows
  • A visual canvas for direct editing once a real document is open
  • A command-driven launcher for search, templates, assets, imports, layers, pages, layout, and design systems
  • A Studio rail for AI, code, imports, infrastructure sync, and linting
  • Export, embed, and share flows for moving work outside the editor

Diagram families in the app

Section titled “Diagram families in the app”

The editor currently has first-class support for these diagram types:

  • flowchart
  • stateDiagram
  • classDiagram
  • erDiagram
  • gitGraph
  • mindmap
  • journey
  • architecture

You will also see reusable node families for general-purpose flows, architecture icon nodes, annotations, sections, images, and wireframe-style surfaces.

Core product concepts

Section titled “Core product concepts”

Local-first by default

Section titled “Local-first by default”

Diagram state lives in the browser by default. You choose when to export, share, or join collaboration-style room flows.

Multiple input modes

Section titled “Multiple input modes”

OpenFlowKit does not force a single source of truth. You can work visually, with AI, through OpenFlow DSL, through Mermaid, through structured imports, or from developer-oriented starter flows.

Editable outputs

Section titled “Editable outputs”

Generated and imported diagrams come back into the same editable canvas model rather than becoming dead screenshots.

Home and editor are separate surfaces

Section titled “Home and editor are separate surfaces”

OpenFlowKit now treats the home screen as the workspace listing surface and the editor as the action surface. The app does not create a fake default flow just to get you onto the canvas.

Start here

Section titled “Start here”