Shadcn.io is not affiliated with official shadcn/ui
Todo List Grouped
A grouped todo list block for React and Next.js with collapsible category sections, task counts, and chevron expand animations built with shadcn/ui and Tailwind CSS
Organize tasks by category with this grouped todo list block for React and Next.js. Features collapsible section headers for Development, Design, Marketing, and Uncategorized groups with task counts, chevron rotation animations, and checkboxes within each group. Built with TypeScript, shadcn/ui Checkbox and Button components, framer-motion staggered entrance animations, and Tailwind CSS. Perfect for cross-functional project trackers, departmental task boards, and categorized backlog management.
Related Components
Multi Board Todo List
Tabbed multiple boards
Nested Todo List
Multi-level deep nesting
Compact Todo List
Ultra-dense compact task view
Card View Todo List
Grid-based card layout for tasks
Analytics Todo List
Task statistics dashboard
Timeline Todo List
Vertical timeline layout
FAQ
Was this page helpful?
Sign in to leave feedback.
Goal Progress
A goal tracking todo list block for React and Next.js with milestone checkpoints, progress bars, target dates, and overall completion built with shadcn/ui and Tailwind CSS
Gtd Inbox
A Getting Things Done inbox processing todo list block for React and Next.js with task classification, category counts, and animated card transitions built with shadcn/ui and Tailwind CSS