xyflow/awesome-node-based-uis

Awesome Node-Based UIs

A curated list with resources about node-based UIs.

Check out CONTRIBUTING.md for instructions on how to add a new link to the list.

Curators: Christopher, John and Moritz from React Flow / Svelte Flow

Javascript Libraries

Renderers

• baklavajs - Graph/node editor for VueJs
• beautiful-react-diagrams - React components and hooks to build diagrams
• butterfly - Renderer for interactive diagrams and flowcharts
• cytoscape.js - Canvas based renderer with utilities and algorithms
• diagram-maker - Interactive editor for any graph-like data
• Flowy - Flowchart library
• flow-builder - React-based renderer for workflows and process diagrams
• Foblex Flow - Angular library for rendering node-based UIs
• GoJS - Diagramming library with a focus on customization and interactivity
• jointjs - JavaScript diagramming library
• jsplumb - Open source project written in Typescript that gives you the tools you need to visually connect DOM elements
• kedro-viz - Visualises Kedro data and machine-learning pipelines
• litegraph.js - A graph node engine and editor
• mermaid - Static diagrams for documentation
• ngx-graph - Graph visualization library for Angular
• ngx-vflow - An open source library to build node-based UI with Angular
• nice-dag - Lightweight javascript library, which is used to present a DAG diagram
• nodl - Framework for computational node graphs
• react-dag-editor - React component to create graphic user interface
• react-digraph - A library for creating directed graph editors
• React Flow - React library for rendering node-based UIs
• reaflow - React library for building workflow editors
• rete - Framework for visual programming and node editors
• Sequential Workflow Designer - Workflow builder component for any JavaScript framework
• sigma.js - Visualization framework for large graphs
• Svelte Flow - Svelte library for rendering node-based UIs
• vue-flow - Flowchart component for Vue 3
• X6 - Diagramming library that uses SVG and HTML
• yFiles - Library for visualizing, editing and analyzing graphs

Layouting

• elkjs - A port of the Java ELK layouting library to Javascript
• d3-hierarchy - Helpers and algorithms for working with hierarchical graphs
• d3-force - Library for creating interactive force directed graphs
• d3-dag - D3 plugin to work with DAG data structures
• dagrejs - Directed graph layout algorithms for Javascript
• graphology-layout - Layout algorithms
• springy - Force directed graph layouts

Graph Utilities

• behave-graph - Extensible behaviour-graph execution engine
  • behave-flow - UI for behave-graph using react-flow
• graphlib - Helpers for directed graphs in JS
• graphology - Utilities and algorithms for all kinds of graphs

Misc

• flume - Business logic graph editor
• mermaid - Flowchart and sequence diagrams generation
• pintora - Text-to-diagrams library
• quick-erd - Generate entity-relationship diagrams (ERD) from text, and reverse engineer ERD text from live database

C Libraries

Renderers

• graphviz - Graph visualization software
• imnodes - Node editor for dear imgui
• node-editor - Node Editor built using dear imgui
• nodeeditor - Dataflow programming framework

.NET Libraries

• Blazor.Diagrams - A fully customizable and extensible all-purpose diagrams library for Blazor.
• nodify - A collection of WPF controls for node based editors designed for MVVM.
• NodeNetwork - A C# library with a WPF node editor component based on ReactiveUI.
• STNodeEditor - A node editor based in Windows Forms and GDI that offers extensive properties and events for streamlined data interaction between nodes.

Rust Libraries

• egui_node_graph - Node applications using egui
• egui-snarl - Crate for creating and manipulating node-graph UIs

Swift Libraries

• Flow - Swift Package Manager-based node graph editor

Go Libraries

Diagramming

• d2 - Scripting language that turns text to diagrams

Applications

Workflow & Automation

• Benthos Studio - Visual editing for the Benthos stream processor
• Cables - Visual programming environment
• Carto Workflows - Spatial analytics tool
• Concourse CI - Container-based continuous thing-doer [OSS]
• Controller Lab - Drag-and-drop tool for remapping input devices
• Dopt - Visual flow builder + APIs/SDKs for powering user onboarding and engagement experiences
• Dots - No-code bot builder for Discord community onboarding & engagement
• DoubleLoop - Dashboard builder to monitor business metrics
• customer.io - Automated messaging platform
• FME - ETL tool with spatial data support
• Flowhub - Visual programming tool [OSS]
• Kelp - Build interactive data-driven apps for operational analytics
• Kuwala - Data Pipelines for BI analysists [OSS]
• Mode - Tool for exploratory analysis
• n8n - Workflow automation platform
• novu - Notification infrastructure for developers [OSS]
• OneSignal Journeys - Workflow builder to automate messaging
• Patterns - Data processing and automation tool
• Power Automate - Automation tool
• Proxeus - Workflow builder for secure documents and more [OSS]
• Retool Workflows - ETL tool for Retool
• Stately - Application logic visualizer [OSS]
• Tracardi - Customer Journey Automation tool [OSS]
• whenthen - Payment orchestration
• workflow86 - Workspace to document, automate and manage business workflows

AI

• Cellulose - Machine Learning Model visualizer and optimization tool
• Netron - Visualizer for machine learning models
• ComfyUI - Stable Diffusion GUI
• CraftGen - Visually build and orchestrate powerful AI agents.

Diagramming

• diagrams.net - also known as draw.io
• FigJam
• Flowchart Fun - Generate flowcharts and diagrams from text [OSS]
• Grapher - Flowchart tool [OSS]
• Knotend - Keyboard-centric flowchart editor
• Lucidchart
• Mermaid Live - Edit, preview and share mermaid charts/diagrams [OSS]
• Miro
• nomnoml - Tool for drawing UML diagrams [OSS]
• QuikFlow - Create flowcharts with a mindmapping workflow
• Terrastruct - Visualize software architecture

Data Processing

• Cascade - Data transformation and visualization
• CodeNect - Visual Programming Software that transpiles to C
• Datablocks - Data transformation and visualization
• Easy Data Transform - Data transformation tool
• Enso - Code based automation tool [OSS]
• Graphqleditor - Editor for GraphQL
• jsoncrack - JSON data visualizer
• node-red - Low-code programming for event-driven applications [OSS]
• Nifi - Data routing, transformation, and system mediation logic
• Rapidcanvas - Data science platform
• Slang - Data processing tool
• Y42 - Data pipeline tool
• Orange Data Mining - Data mining and processing tool [OSS]

3D & Visuals

• Plantarium - Procedural browser-based plant modelling [OSS]
• Alma - Digital playground for visual experiences
• Armory3d - Game engine for Blender
• Blackjack - Procedural modelling application [OSS]
• Blender - 3D graphics suite for multiple rendering engines [OSS]
• Cascade - Image editor [OSS]
• Chainner - Image processing GUI [OSS]
• ComfyUI - Design and execute advanced Stable Diffusion pipelines for AI image generation [OSS]
• Dynamo - Open Source Graphical Programming for Design [OSS]
• FFmpeg Explorer - Tool for exploring FFmpeg filters
• Gaffer - Application for lookdev, lighting and automation [OSS]
• Gimel Studio - 2D image editor [OSS]
• Houdini - Procedural system for artists
• Mixture - Unity plugin to create textures in realtime [OSS]
• Natron - Compositing software for VFX and motion graphics [OSS]
• Nodebox - App for visualization and generative design [OSS]
• Nodes.io - Visual programming environment
• Nodetoy - Shader tool
• Notch - Motion graphics and interactive VFX in realtime
• Origami Studio - UI design prototyping tool
• Polygonjs - WebGL design tool [OSS]
• Protongraph - Procedural content generation [OSS]
• Puredata - Visual programming language for multimedia [OSS]
• Retrobatch - Batch image processing for macOS
• VVVV - Visual live-programming environment

Audio

• Audio Hijack - Audio recording and routing for macOS
• Audulus - Modular synthesizer and DSP environment
• Axiom - Realtime audio synthesizer [OSS]
• Bespoke - Modular synthesizer [OSS]
• Eternal - Audio and visual composition [OSS]
• Kronos - Visual & textual programming language designed for musical signals
• Max - Tool to create your own interactive software
• Ossia score - Sequencer for audio-visual artists [OSS]
• Reaktor - Modular digital signal processor
• Zupiter - Synthesizer

Scripting

• flojoy - No code Python programming
• Natto - Javascript environment
• noflo - Flow-based programming for Javascript [OSS]
• PyFlow - Visual scripting framework for python [OSS]
• Ryven - Visual scripting for python [OSS]
• Regex Nodes - Analyze and build regular expressions in your browser [OSS]

Misc

• Twine - Tool for telling interactive, non-linear stories