xyflowReact Flow | Svelte Flow - Powerful open source libraries for building node-based UIs with React (https://reactflow.dev) or Svelte (https://svelteflow.dev). Ready out-of-the-box and infinitely customizable.

xyflow

xyflow provides powerful open-source libraries for building node-based user interfaces with React or Svelte. Both React Flow and Svelte Flow come ready out-of-the-box with essential features while remaining infinitely customizable for complex use cases.

Key Features

• Dual Framework Support: Dedicated libraries for React (@xyflow/react) and Svelte (@xyflow/svelte) with consistent APIs
• Built-in Components: Includes MiniMap, Controls, Background, and other essential UI components for interactive graphs
• Infinite Customization: Create custom node types, edges, and behaviors to match any design requirement
• Performance Optimized: Efficient rendering and state management for handling large graphs smoothly
• TypeScript Support: Fully typed for enhanced developer experience and code reliability
• Commercial Friendly: MIT licensed with optional paid support through React Flow Pro

Use Cases

• Workflow Editors: Build visual workflow and automation tools with drag-and-drop node connections
• Data Visualization: Create interactive flowcharts, diagrams, and relationship visualizations
• AI/ML Pipelines: Design and visualize machine learning pipelines and computational graphs
• Process Mapping: Develop business process diagrams and system architecture visualizers
• Node-based Editors: Power creative tools, audio processors, and shader editors with node graphs

Who Is It For

xyflow is designed for React and Svelte developers who need to build sophisticated node-based interfaces without starting from scratch. It serves teams building workflow automation, data visualization, AI tooling, and any application requiring interactive graph-based UIs.