# Dashboard

KPIs, metric tiles, trackers and app shells. 6 live React parts in [Beamline](https://beamline.io/), each in nine looks.

- [App shell](https://beamline.io/components/app-shell): The frame for every app screen: collapsible sidebar with grouped navigation, top bar and page.
- [Bar list](https://beamline.io/components/bar-list): Ranked horizontal bars with label inside and value at the end — top pages, sources, customers.
- [Category bar](https://beamline.io/components/category-bar): One bar split into labelled ranges with an optional marker that names its range.
- [Insight cards](https://beamline.io/components/insight-cards): Findings from an agent, one per page: the sentence, the series it is about with their change, a chart to scrub that names each point, and a follow-up question.
- [Metric card](https://beamline.io/components/metric-card): A KPI: label, a value that rolls to each new number, the change with arrow, sign and tone, a trend line and context; unmeasured values are hatched, never zero.
- [Tracker](https://beamline.io/components/tracker): A row of status blocks for uptime, job runs or daily checks, with tooltips and a legend.

190 React components and screens your coding agent (Claude Code, Codex, Cursor or any MCP client) installs into your app through Beamline's MCP server, as a ready-built package or as plain React source you can change. $49 one payment (regular $200), no subscription, a year of updates, one licence for your whole team.

Other categories: [Actions](https://beamline.io/components/actions) · [Form controls](https://beamline.io/components/forms) · [Overlays](https://beamline.io/components/overlays) · [Navigation](https://beamline.io/components/navigation) · [Layout](https://beamline.io/components/layout) · [Feedback](https://beamline.io/components/feedback) · [Content & display](https://beamline.io/components/display) · [Data & tables](https://beamline.io/components/data) · [Charts & data-vis](https://beamline.io/components/charts) · [Trading](https://beamline.io/components/trading) · [AI & agents](https://beamline.io/components/ai) · [Voice & audio](https://beamline.io/components/voice) · [Motion & effects](https://beamline.io/components/effects) · [Blocks](https://beamline.io/components/blocks)