Chart Card — KPI header
brand-ui/chart-card-kpi-01UnverifiedBlock
An elevated chart-in-a-card: a header with a headline KPI + delta + a segmented period control (ToggleGroup), a token-coloured AreaChart, and a footer breakdown legend. The period control re-renders the chart.
Install it
npx shadcn@latest add https://raw.githubusercontent.com/mreimitz/elabs-components/main/registry/chart-card-kpi-01.jsonThis registry does not serve an item endpoint we could read, so we hold its metadata but not its source.
What it pulls in
npm packages
Files it writes
More from brand-ui
All 21 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| AI chart in conversationai-chart | brand-ui | Blocks | Unverified | 4 deps | |
| AI chat shellai-chat-shell | brand-ui | Blocks | Unverified | 3 deps | |
| App shellapp-shell | brand-ui | Blocks | Unverified | 3 deps | |
| ChartFrame + data tablechart-frame-data | brand-ui | Blocks | Unverified | 5 deps | |
| Code workspacecode-workspace | brand-ui | Blocks | Unverified | 4 deps | |
| Data tabledata-table | brand-ui | Blocks | Unverified | 4 deps | |
| Flow builderflow-builder | brand-ui | Blocks | Unverified | 5 deps · 3 files | |
| Flow canvasflow-canvas | brand-ui | Blocks | Unverified | 4 deps |
