<Stat> renders Pure Admin's .pa-stat metric card. The default layout pairs an
optional icon with a number + label; the hero layouts (layout="hero") add a change indicator; the square layout is a compact KPI tile, coloured with variant (optionally with a currency/unit symbol), laid out
flush inside a <KpiGrid>.
Default — icon + number + label
1,234
Total Users
$12,345
Revenue
86%
Conversion
42
Open Tickets
Hero — number with change indicator
Monthly Revenue
$84,200
+12.5% vs last month
New Signups
3,120
+4.2%
Churn Rate
1.8%
-0.3%
Hero compact
Uptime
98.9%
+0.1%
Avg Response
312ms
-18ms
Square — compact KPI tiles (KpiGrid)
Square tiles with a trailing unit symbol, or a prefixed currency symbol via isSymbolPrefix.
847
K
Impressions
92
%
Satisfaction
23
°C
Server Temp
$
12.4
Cost / lead
4.8
★
Avg Rating
Usage
Default
<Stat number="1,234" labelText="Total Users" iconVariant="primary">
{#snippet icon()}<i class="fa-solid fa-users"></i>{/snippet}
</Stat> Hero with change direction
<Stat layout="hero" number="$84,200" labelText="Monthly Revenue" changeText="+12.5%" changeDirection="very-positive" />
Square KPI tiles
<KpiGrid> <Stat layout="square" variant="primary" number="847" symbolText="K" labelText="Impressions" /> <Stat layout="square" variant="danger" number="12.4" symbolText="$" isSymbolPrefix labelText="Cost / lead" /> </KpiGrid>