Back to components
Productivity component
Kanban Board
Drag-and-drop board with column management, card creation, and swimlanes.
Install
$ Run in your project root
pnpm dlx shadcn@latest add https://vibekit.desishub.com/r/kanban-board.jsonWhat it does
- Drag-and-drop between columns with keyboard accessibility (dnd-kit)
- Add, rename, and delete columns inline
- Card creation dialog with title, description, and label
- Drag overlay preview with rotation feedback
- Controlled component — columns and onColumnsChange handler
When to use
Use it
CRM pipelines, project management, content calendars, hiring boards, lightweight task trackers.
Skip it
Linear-style nested tasks or Gantt-style timelines — use a dedicated project management library.
Prerequisites
- React 18+
- shadcn/ui base components
- dnd-kit (installed automatically)