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.json

What 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)

Related components