Component

Statistic

Pairs a label/value with an optional trend. Numeric values count up from zero the first time they scroll into view.

Basic

Active users

Revenue

Conversion

0.0%

Revenue

8.2%

Churn

0.0%

0.6%

Revenue

8.2%

Orders

3.1%

Refunds

4.4%

The count-up runs once per mount via IntersectionObserver and respects prefers-reduced-motion

Prop	Type	Default	Description
value	number \| ReactNode	None	Numeric values count up once when visible.
prefix / suffix	ReactNode	None	Content around the value.
trend	number	None	Positive or negative percentage change.
decimals	number	0	Decimal places used by numeric count-up.
trendLabel	string	None	Optional text displayed after the trend value.
card	boolean	false	Wraps the tile in Card's surface.
className	string	None	Additional classes applied to the component root.

valueNone

number | ReactNode

Numeric values count up once when visible.

prefix / suffixNone

ReactNode

Content around the value.

trendNone

number

Positive or negative percentage change.

decimals0

number

Decimal places used by numeric count-up.

trendLabelNone

string

Optional text displayed after the trend value.

cardfalse

boolean

Wraps the tile in Card's surface.

classNameNone

string

Additional classes applied to the component root.