Shadcn Todo List Blocks

Browse 10+ animated todo list sections built with React, Tailwind CSS and shadcn/ui. Copy & paste the code or install via the shadcn CLI.

10 blocks

Todo List 1

Simple add, complete and delete

Todo List 2

Filters All, Active and Done

Todo List 3

Priorities and due labels

Todo List 4

Grouped by project

Todo List 5

Reorder with move buttons

Todo List 6

Subtasks with progress

Todo List 7

Today and Upcoming tabs

Todo List 8

Keyboard-first input

Todo List 9

Kanban-lite three columns

Todo List 10

Compact checklist card

Shadcn UI Todo List Blocks, Sections & Components

Each todo list block is a self-contained React component with its copy exposed as props. Copy the code, install it through the shadcn CLI, or let your AI assistant pull it in through the Chocolate MCP server. You own the code and can change anything.

FAQs