Statistic

Atom

Bare numeric/text figure with a label, optional prefix/suffix, trend indicator, and loading skeleton — no card chrome (compose with Card for a bordered KPI tile).

Basic

Preview

Active users

1284

Open tickets

12
Code
<Statistic label="Active users" value={1284} />
<Statistic label="Open tickets" value={12} />

Prefix / suffix / trend

Preview

Revenue

$82400+12.4%

Conversion rate

4.2%-0.6%

Loading example

Code
<Statistic label="Revenue" value={82400} prefix="$" trend="up" trendValue="+12.4%" />
<Statistic label="Conversion rate" value={4.2} precision={1} suffix="%" trend="down" trendValue="-0.6%" />
<Statistic label="Loading example" value={0} loading />
Sourcemodules/ui/Statistic.tsx