Shadcn.io is not affiliated with official shadcn/ui
Todo List Dark Minimal
A dark-themed minimal todo list block for React and Next.js with zinc-950 background, subtle borders, glowing focus states, and ultra-clean aesthetic built with shadcn/ui and Tailwind CSS
Embrace a dark-first design with this ultra-minimal todo list block for React and Next.js. Features an explicit zinc-950 background independent of theme, white text on dark, subtle zinc-800 borders, glowing focus ring states, and semantic emerald for completion indicators. Built with TypeScript, shadcn/ui Button and Input components, framer-motion staggered entrance animations, and Tailwind CSS. Perfect for developer tools, terminal-inspired interfaces, and dark-mode productivity dashboards.
Related Components
Automation Todo
Task automation rules
Natural Language Todo
Smart text parsing task input
Color Coded Todo
Color category task system
Emoji Status Todo
Emoji-based status indicators
Matrix Todo
Effort vs impact matrix
Keyboard Shortcuts Todo
Keyboard navigation focused
FAQ
Was this page helpful?
Sign in to leave feedback.
Daily Planner
A daily planner todo list block for React and Next.js with morning, afternoon, and evening sections, progress bar, and motivational completion message built with shadcn/ui and Tailwind CSS
Delegation
React todo list delegation workflow block for Next.js with assignee dropdowns, delegation chains, status badges, and notification indicators using shadcn/ui and Tailwind CSS