STORY CHARTS
Story charts, by question.
Story charts show what your numbers mean, not just their shape. Grouped by the question they answer, so you pick by what you need to show.
01 · Part-to-whole
How is the total split?
100 orbs, one per percent. The split reads at a glance and morphs when the period changes.
02 · Flow and funnel
Where do people drop off?
Visitors flow through the stages as dots, and every drop-off lands in a tray you can count.
- DocsPro, with your registry key:
npx shadcn@latest add @beautiful-ui-pro/glass-flow-funnelPro, with your registry key
03 · Coverage over time
How many hit the target?
One square per market that beat its target, dropping into weekly columns with gravity.
- DocsPro, with your registry key:
npx shadcn@latest add @beautiful-ui-pro/lumen-market-breadthPro, with your registry key
04 · Distribution and cohort
Which group is different?
Every customer as a tile, stacked by value and grouped by plan, or bars that name the leader.
- DocsFree, no account:
npx shadcn@latest add https://beautiful-ui.dev/r/lumen-customer-swarm.jsonFree, no account
05 · Progress
Are we closing the goal?
One spoke per day stacks three goals, so a month of progress fits in one ring.
06 · Trend
What changed over time?
A playhead walks the line, milestones spring up and events explain the jumps.
- DocsFree, no account:
npx shadcn@latest add https://beautiful-ui.dev/r/glass-stat-cards.jsonFree, no account