Kanban Board
Kanban board with native drag and drop between columns, drop indicators and quick add.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
KanbanBoardProps
Also accepts all props of Omit<React.ComponentProps<"div">, "onChange">
| Prop | Type | Default | Description |
|---|---|---|---|
| columns* required | KanbanColumn[] | — | — |
| defaultCards | KanbanCard[] | [] | — |
| onCardsChange | (cards: KanbanCard[]) => void | — | — |
| columnWidth | number | 280 | Column width in px |
| showCount | boolean | true | — |
| allowAdd | boolean | true | Show an "Add card" button under each column |
Install
$ npx shadcn@latest add https://chromotion.dev/r/kanban-board.jsonThe CLI installs the base component; your customizations live in the code generated on the Customize tab.