Shadcn.io is not affiliated with official shadcn/ui
Empty State First Project
A split-layout empty state prompting users to create their first project with an illustration area on the left and encouraging copy with CTA on the right, built with React, Next.js, shadcn/ui, and Tailwind CSS
Encourage users to take their first step with this split-layout empty state block. Features a decorative illustration panel on the left with folder and file iconography, a warm heading on the right, descriptive copy about what projects enable, and a prominent create project button. Built with React, Next.js, shadcn/ui Button, motion/react entrance animations, and Tailwind CSS.
Related Components
No Projects Empty State
No projects created centered state
Welcome Workspace Empty State
Fresh workspace greeting with explore CTA
Getting Started Empty State
Onboarding checklist setup prompt
No Folders Empty State
Empty folder structure state
No Documents Empty State
Empty document library state
No Tasks Empty State
Empty task board state
FAQ
Was this page helpful?
Sign in to leave feedback.
Connect Tools
An empty state prompting users to connect their first integration with a grid of tool icon placeholders, descriptive messaging, and browse integrations CTA built with React, Next.js, shadcn/ui, and Tailwind CSS
Getting Started
An onboarding checklist empty state with progress indicator, four setup steps with checkboxes, and completion tracking built with React, Next.js, shadcn/ui, and Tailwind CSS