- Activity Heatmap
- Activity Rings
- Bar Chart
- Bar List
- Command Palette
- Composed Chart
- Corner Frame
- Data Table
- Delta Badge
- Distribution Bar
- Donut Chart
- Dot Plot
- Funnel Chart
- Heatmap Chart
- KPI Card
- Metric List
- Metric Value
- Period Tabs
- Radar Chart
- Radial Gauge
- Sankey Chart
- Scatter Chart
- Segmented Meter
- Sparkline
- Tick Bar
- Timeline
- Trend Chart
- Activity Rings Card
- Allocation Card
- Balance Chart Card
- Breakdown Card
- Commerce KPI Row
- Contributions Card
- Data Table Card
- Distribution Card
- Dot Plot Card
- Dual Metric Card
- Funnel Chart Card
- Goal Chart Card
- Heatmap Chart Card
- Insight Card
- KPI Row Card
- Metric Tabs Chart Card
- Payment Summary Card
- Period Bar Chart Card
- Progress Card
- Revenue Ring Card
- Ring KPI Card
- Score Gauge Card
- Stage Bars Card
- Status Gauge Card
- Tick KPI Card
Introduction
Dashboard and analytics components for shadcn/ui, distributed through a shadcn-compatible registry.
What it is#
dashboardcn is a set of components for the parts of a product that shadcn/ui leaves to you: KPI cards, time series charts, funnels, ranked lists, calendar heatmaps, and data tables.
It is not a component library you install from npm. Each component is copied into your project with the shadcn CLI, exactly like shadcn/ui itself. You get the source, the styling lives in your Tailwind theme, and there is nothing to upgrade against.
Why#
This project started from a gap. When building a product dashboard, there was no obvious place to find components for presenting data well: KPI tiles, trend charts, funnels, ranked lists, and the cards that combine them. Where such collections existed, they were sold behind a license.
User interface code should be free. shadcn/ui set that expectation for the base primitives, and dashboardcn extends it to the data-heavy parts of a product. Everything here is MIT licensed, copied into your project as source, and yours to change.
Foundations#
- Tailwind CSS v4 and the shadcn/ui theme variables.
- shadcn/ui primitives such as Card, Table, and Chart.
- recharts for charts, through shadcn's chart wrapper.
- TanStack Table v9 for data tables.
Radix or Base UI#
Components that render only HTML and CSS work with either the Radix or Base UI flavor of shadcn/ui. Components that depend on shadcn primitives pull the flavor your project already uses.
Continue to Installation.