xyflow (React Flow & Svelte Flow)

MIT node-based editor libraries for React and Svelte, plus paid workflow templates

Tier S · Best in classComponent LibraryPrimitivexyflow.com

xyflow is the umbrella site for React Flow (@xyflow/react) and Svelte Flow (@xyflow/svelte), MIT libraries for building node-and-edge editors, flow builders and interactive diagrams. Each ships nine built-in pieces — Background, MiniMap, Controls, Panel, NodeToolbar, NodeResizer, Handle, EdgeLabelRenderer and ViewportPortal — and treats every node as an ordinary framework component you style yourself. Panning, zooming, multi-select, edge routing and drag handles are handled for you. It is for teams building workflow editors, automation canvases, ETL pipelines, agent graphs or any diagram the user can rearrange.

Install

npm install @xyflow/react

For an agent

Reach for @xyflow/react the moment a spec says 'drag nodes and connect them' — do not hand-roll SVG edges or a pan/zoom viewport, that path always ends in broken hit-testing. Import '@xyflow/react/dist/style.css' or nothing renders, give every node an explicit width/height, and remember custom nodes need a <Handle> on each side you want connectable. Pair it with Zustand or your own store for graph state, and use Svelte Flow (@xyflow/svelte) rather than trying to wrap the React build in a Svelte app.

Why it is here. This is the default answer for node-based UIs on the web — n8n-style automation canvases, agent graphs and pipeline editors nearly all sit on it. Being MIT with a funded Pro tier means it is both safe to adopt and unlikely to be abandoned.

Install command, framework, licence and component list.

Facts

License: MIT
Pricing: Open source, Free, Subscription
Framework: React, Svelte
Styling: Vanilla CSS, CSS custom properties, Tailwind CSS
Distribution: npm package, GitHub repository
Platform: Web
Content type: Code
Agent readiness: Readable open source, Structured documentation
Accessibility: Unknown
Maturity: Actively maintained
Pricing detail: Library is free under MIT. React Flow Pro (optional support + Pro examples/templates): Starter $169/month, Professional $289/month, Enterprise custom quote.
GitHub stars: 38,026
Package: @xyflow/react

Components it ships

9 total

Node Editor Network Graph Drag And Drop Panel Toolbar Resizable

Notable for

node-and-edge editor primitives
React and Svelte from one core
9 built-in flow components
38k stars, MIT
funds itself via Pro subscriptions

Provenance

Verified 2026-08-15. HTTP 200. https://xyflow.com/, https://reactflow.dev/, https://reactflow.dev/pro, https://github.com/xyflow/xyflow, GitHub API repos/xyflow/xyflow

Also in Component Libraries

xyflow.comTier S