Koala logo Design
No matches for “
↑↓ navigate open Esc close
Components KPI tile

KPI tile

A read-only "over time" KPI tile — a card with a section label, a big figure, an optional slotted trend chip (e.g. a trend indicator + "vs last month"), and an optional subline. Drop several into a grid for a dashboard "Over time" row. Unlike <koala-stat-tile> it doesn't navigate — it reports a metric, so no href or arrow.

<koala-kpi-tile>

£64,480

18% vs last month

12

3 vs last month

6%

2 pts vs last month

2 fell through

<koala-kpi-tile label="Net revenue" value="£64,480">
    <partial name="_TrendIndicator" model="..." /> <span>vs last month</span>
</koala-kpi-tile>

Pass a pre-formatted value; slot the trend chip as child content (the conveyancer dashboard slots _TrendIndicator + a "vs last {period}" caption).

4 attributes
Attribute Values Notes
label string Section label above the figure.
value string The pre-formatted headline figure.
subline string? Optional muted caption below the trend (e.g. "3 fell through").
(content) slot The trend chip — a trend indicator + comparison caption.

£64,480

18% vs last month
Do Use it for a read-only period metric with a trend vs the previous period.
A clickable count that deep-links to a filtered list
Don't Don't use it for a figure that navigates somewhere — that's <koala-stat-tile> (arrow, hover-lift, href).