Deck
Stats slide
The executive-summary band on the VI canvas: two to four headline figures in a row, each a hairline-ruled value, label and optional support line. The number is the design: no colour, delta or icon decorates it, and values arrive pre-formatted.
Install
npx shadcn@latest add @alix/statsSlidePreview
£14mRecoverable EBITDA
From decisions already made.
90 daysTo first cash
3×Coverage of the ask
Where the value sits
Illustrative
Usage
import { StatsSlide } from "@/components/deck/statsSlide";
<StatsSlide
title="Where the value sits"
stats={[
{ value: "£14m", label: "Recoverable EBITDA", description: "From decisions already made." },
{ value: "90 days", label: "To first cash" },
{ value: "3×", label: "Coverage of the ask" },
]}
source="Illustrative"
/>Examples
01
Titleless band, two figures
The title is optional; omit it and the band owns the canvas alone. Two to four figures fill the row.
£53mFY25 EBITDA
Up from £46m.
+15%Margin recovery
Northwind management accounts
<StatsSlide
stats={[
{ value: "£53m", label: "FY25 EBITDA", description: "Up from £46m." },
{ value: "+15%", label: "Margin recovery" },
]}
source="Northwind management accounts"
/>02
Four figures
The row takes its column count from the data: two, three, or four.
£14mEBITDA at stake
90 daysTo first cash
4Workstreams
3×Coverage
The programme at a glance
Illustrative
<StatsSlide
title="The programme at a glance"
stats={[
{ value: "£14m", label: "EBITDA at stake" },
{ value: "90 days", label: "To first cash" },
{ value: "4", label: "Workstreams" },
{ value: "3×", label: "Coverage" },
]}
/>When to use it
Use it for
- 2–4 headline figures the room should remember: the executive summary band.
- Values pre-formatted as they should read ("£14m", "94.2%"); the slide never reformats them.
- An optional one-line support clause per figure.
Reach for something else
- A figure that needs arguing. It belongs in a WaterfallSlide or KeyPoints.
- Decorating the number with colour, a delta, or an icon: the value is the design.
- More than four figures: the row is a summary, not a table.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | – | Optional slide title; omit it and the band owns the canvas alone. |
| stats | { value: string; label: string; description?: string }[] | – | Each figure pre-formatted by the caller; the slide owns the typography, never the number-crunching. Two to four fill the row, tabular so columns of figures align. |
| source | string | – | The credit line; joins the footer meta row ahead of any other meta. |
| meta | string[] | – | Additional deck chrome for the footer meta row. |