Dashboard components, built for shadcn/ui
KPI cards, charts, funnels and tables, installed with the CLI so you own the code. Free, MIT licensed, no Pro tier.
Opens the app with a prompt ready to send, or the web app if it is not installed. Nothing runs until you press enter.
- Performance metricsDetailsStableService uptime: 99.7%6 reviewers
K
Status gauges
A clear health signal, supporting metric, and segmented gauge in one glance.
- TransactionsPeak: Wed106Kvs last period+34,002
Distribution cards
A big number, the shape of the week behind it, and the peak called out.
- Leads overview5421.43%New leadsTop sourceLinkedIn198Returning leadsConversion rate12.8%
Paired metrics
Two numbers side by side, each with its meter, its share, and one supporting fact.
Complete cards, composed from the primitives. Drop one in and pass your data.
- Allocation CardPortfolio allocation46%+3.4%vs prior periodEquities exposure: $4.7M6 members
KA share-of-total card with a period switcher, a big percentage with delta, a tick bar, and a footer stat with an avatar stack.
- Breakdown CardGross volume$41,540+15.0%
- Online payments$26,800
- Subscriptions$10,400
- In-store sales$4,340
A total with delta and a list of contributors, each with a value and a hatched bar showing its share.
Built withDelta BadgeMetric Value
- Distribution CardCapital inflows$12.4M+$390K
- WaveMark CapitalCapital in$7.93M
- Envato FinancesCapital in$3.21M
- QBridge TechCapital in$1.25M
A total with delta, a stacked share bar, and a ranked list of the contributors with their values.
Built withDelta BadgeDistribution BarMetric Value
- WaveMark Capital
- Funnel Chart CardSign-up funnel197+5.2%vs previous period100%56%39%19%Link opened197Started110Completed77Converted38
A conversion card with a flow funnel: a headline value with delta, a range picker that carries its own steps, and a tile per stage. Hovering a stage swaps the headline.
Built withFunnel ChartDelta BadgeMetric Value
- Period Bar Chart CardSpending$10,420.00+126.7%Mar spending vs Feb
A card with a total for the selected period, a range switcher, and a bar chart that highlights that period. Click a bar to select its period.
Built withBar ChartDelta BadgePeriod Tabs
- Insight CardInsights
A hero card with a badge, a very large number, a headline, and a paged set of insights over a soft gradient.
Built withMetric Value
27 components and counting, and none of it costs extra.
- KPI Card
A metric card with value, period-over-period delta, and an optional sparkline.
- Trend Chart
Area, line, or bar chart over time with tooltips and legend, built on shadcn's chart primitives.
- Data Table
A sortable, filterable, paginated table with column visibility, row selection, sticky and reorderable columns, and loading states, built on TanStack Table v9.
- Funnel Chart
Step-by-step conversion, as stacked bars with drop-off or as a flow of tapering stages with a tile per step.
- Bar Chart
A single-series bar chart with gradient or striped fills, highlighted bars, and a hover marker.
- Radial Gauge
A semicircular or ring gauge, continuous or segmented, with content in the middle.
- Activity Heatmap
A calendar heatmap of daily activity, in the style of a contribution graph.
- Bar List
A ranked list with proportional bars, for top pages, referrers, or countries.
- Composed Chart
Mix areas, lines, and bars in one chart with dual axes, reference lines, peak markers, and hatched bars.
User interface code should be free. All of it.
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.
shadcn/ui set the expectation that the base primitives are free. 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.
How it usually works
Dashboard kits sell the good parts. The free tier is a teaser, the charts and tables sit behind a Pro plan, and the license key decides how many projects you may use them in.
Why we bother
shadcn/ui set the expectation that user interface code should be free. dashboardcn extends that to the data-heavy parts of a product, which is where the paywalls usually start.
Free forever. We will never charge for it.
$0forever
No Pro tier, no license key, no seat count, no account. Not now, not later.
- 27 components
- 25 composed blocks
- Markdown docs and llms.txt
- Radix or Base UI
- MIT license, commercial use included
Star the repo if it saves you a week. That is the whole price.
What people ask before they install.
Is dashboardcn free?
Yes. Every component and block is MIT licensed, with no Pro tier, no license key, and no account. You can use it in commercial products and redistribute the source.
How is it different from shadcn/ui?
shadcn/ui covers the base primitives: buttons, dialogs, forms, and the chart wrapper. dashboardcn adds the data components a dashboard needs, such as KPI cards, trend and composed charts, funnels, gauges, heatmaps, and a full data table, built on those same primitives and installed with the same CLI.
How is it different from BoardUI or Tremor?
BoardUI and Tremor are complete design systems with their own tokens and primitives. dashboardcn only ships dashboard components and uses your existing shadcn/ui theme, so the pieces look like the rest of your app. BoardUI sells its Pro components; dashboardcn is entirely free.
Does it work with Base UI as well as Radix?
Yes. Components that render only HTML and CSS work with either flavor of shadcn/ui, and components that depend on shadcn primitives pull the flavor your project already uses.
Do I need Next.js?
No. The components are plain React with Tailwind CSS v4 and work in any project where the shadcn CLI works, including Vite, Remix, and Next.js.
Can coding agents use it?
Yes. Every docs page is available as Markdown, llms.txt indexes them, and there is a skill that teaches an agent how to pick, install, and compose the components. shadcn's MCP server can install from the registry once the namespace is registered.
What happens when a component is updated?
Nothing, unless you want it to. The source is copied into your project, so there is no package to bump and nothing changes underneath you. Run the install command again to pull the newer version over the old file.