Flowchart

A sequence of steps on a dotted canvas, connected by curves that measure the actual cards and follow as you drag one. Click a step to light up its connectors, or edit an if/else step's chips with real dropdowns.

Library

EaseUI

Framework

React

Type

component

License

MIT

Install

npx shadcn@latest add @easeui/flowchart

Files

• components/motion/flowchart.tsx
• components/motion/badge.tsx
• lib/ease.ts
• lib/utils.ts

Source

https://github.com/rjcuff/easeui

Categories

• Diagram Components
• React Diagram Components
• Tailwind CSS Diagram Components
• Animated Diagram Components
• Flow Diagram Components
• React Flow Diagram Components
• Tailwind CSS Flow Diagram Components

More from EaseUI

• Accordion
• Agent Loading States
• Alert
• Avatar
• Badge
• Button
• Card
• Checkbox
• Code Block
• Command Palette
• Copy Button
• Diff View