# OpenFlowKit

> Free, open-source diagram tool for builders with code-first and drag-and-drop workflows, powered by React Flow.

OpenFlowKit is a 100% free, open-source diagram engine designed for developers and designers who need beautiful, production-ready diagrams without the hassle of traditional tools. It offers both code-first and visual drag-and-drop workflows, allowing users to write diagrams in code or design them visually while getting consistent, professional results. Built on React Flow, it provides a fully customizable canvas with white-label capabilities.

- **Diagram as Code** - First-class support for Mermaid.js and a type-safe DSL, enabling users to define architecture in code, export as JSON, and let the engine handle automatic layout.

- **Flowpilot AI** - Chat with your diagram using natural language commands like "Add a Redis cache" or "Make the corners rounder" to modify diagrams conversationally (bring your own API key).

- **Local & Private** - Everything stays on your machine with no cloud saves, tracking, or syncing to external servers, ensuring full data privacy and offline capability.

- **Figma Export** - Copy diagrams and paste directly into Figma as editable text and clean vector shapes without any plugins required.

- **Customizable Aesthetics** - Break free from generic enterprise templates with fully customizable fonts, colors, and shapes to create diagrams that match your brand.

- **Multiple Export Formats** - Export diagrams as SVG, PNG, PDF, or JSON for version control and sharing.

- **Live Sync** - Edit code and see changes instantly with real-time preview between code and visual representation.

- **Auto-Layout** - One-click automatic layout engine handles positioning so you don't waste hours aligning boxes manually.

To get started, clone the repository using `gh repo clone openflowkit` and run it locally. The tool requires no account or credit card, and all features are included in the free MIT-licensed version. Users can create unlimited diagrams and projects, save locally, and customize branding to their needs.

## Features
- Diagram as Code with Mermaid.js and type-safe DSL
- Flowpilot AI assistant for natural language diagram editing
- Local-first architecture with offline support
- Figma export with editable vectors and text
- Customizable themes, fonts, colors, and shapes
- Export to SVG, PNG, JPG, PDF, and JSON
- One-click auto-layout
- Live sync between code and visual editor
- White-label branding
- React Flow powered canvas
- Unlimited diagrams and projects

## Integrations
Figma, Mermaid.js, React Flow

## Platforms
WEB, API

## Pricing
Open Source

## Version
1.0

## Links
- Website: https://openflowkit.com
- Repository: https://github.com/Vrun-design/FlowMind
- EveryDev.ai: https://www.everydev.ai/tools/openflowkit