Repolode
Submit
tone-row

tone-row/flowchart-fun

A webapp that turns plain text outlines into flowcharts and diagrams, built with React and cytoscape.js.

Open-source alternative to:LucidchartDraw.io

View on GitHubWebsite
Stars
3,399
Forks
245
Open issues
12
Last commit
4 days ago

What is it?

Flowchart Fun generates flowcharts from text. You write nodes and their connections in an indented, plain-text syntax, and the app renders them as a diagram in the browser, so you can sketch ideas and plans without dragging shapes around.

The input uses indentation and labels such as "goes to:" to define edges, and a node can point back to an earlier node to form loops. The interface is built with React, and the layout is drawn with cytoscape.js. The text parsing is handled by a separate library, Graph Selector.

The project can run locally without login features using `pnpm dev`. Login-related features depend on Vercel, Supabase, Stripe and SendGrid accounts. The app is translatable through .po locale files.

Key features

  • 01Generates flowcharts from indented plain-text input.
  • 02Supports links that loop back to earlier nodes.
  • 03Built with React and cytoscape.js for rendering.
  • 04Interface text is translatable through .po locale files.
  • 05Includes Jest unit tests and Playwright end-to-end tests.

Use cases

  • Sketching process flows or decision trees quickly from notes.
  • Planning user flows or system logic before building them.
  • Turning a written outline into a shareable diagram.

Quick start

  1. 1

    Clone the repository

  2. 2

    Copy .env.example to .env and add environment variables

  3. 3

    Install dependencies with pnpm

    pnpm install
  4. 4

    Build the shared and formulaic packages

    pnpm -F shared build && pnpm -F formulaic build
  5. 5

    Run the app without login features

    pnpm dev

Things to know

  • Running the full app with login features requires accounts on Vercel, Supabase, Stripe and Sendgrid.
  • Deploying with login features needs a Vercel Pro account because it uses more than 12 serverless functions.

Topics

#flowchart#diagram#react#typescript#text-to-diagram#visualization#diagram-generator#flowchart-editor#generator#graphs

FAQ

What is flowchart-fun?
A webapp that turns plain text outlines into flowcharts and diagrams, built with React and cytoscape.js. Flowchart Fun generates flowcharts from text. You write nodes and their connections in an indented, plain-text syntax, and the app renders them as a diagram in the browser, so you can sketch ideas and plans without dragging shapes around.
Is flowchart-fun free to use? What license does it have?
flowchart-fun is open source under the MIT license. Check the license terms before using it in commercial products.
Is flowchart-fun still maintained?
Actively maintained. The last commit to flowchart-fun was on Oct 16, 2026.
What can I use flowchart-fun for?
Sketching process flows or decision trees quickly from notes. Planning user flows or system logic before building them. Turning a written outline into a shareable diagram.
How do I install flowchart-fun?
Clone the repository Copy .env.example to .env and add environment variables Install dependencies with pnpm: pnpm install Build the shared and formulaic packages: pnpm -F shared build && pnpm -F formulaic build Run the app without login features: pnpm dev
Where can I get flowchart-fun?
The source code and installation instructions are on GitHub: https://github.com/tone-row/flowchart-fun

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects