Shadcn.io is not affiliated with official shadcn/ui
Empty Chart
A React empty chart state with large BarChart3 icon showing no data available message without action buttons
Charts without data look broken—users wonder if visualization failed. This React empty state uses shadcn/ui Empty component with large BarChart3 icon (h-16 w-16) from Lucide React featuring No data available title and explanation about pending data. Built with EmptyMedia without variant showing oversized icon and text-muted-foreground styling. The empty chart pattern manages expectations—perfect for analytics dashboards, reporting tools, data visualizations, or anywhere charts depend on external data that might not exist yet.
Empty Chart preview
Installation
Related Components
Empty Table
Empty data table with action
No Notifications
Informational empty state
Bar Chart
Standard bar chart with data
Link Action
Empty state with documentation link
Card Component
Chart card container
Skeleton Component
Loading skeleton for charts
FAQ
Was this page helpful?
Sign in to leave feedback.