Revenue (Up)

Stat card showing revenue with a positive trend indicator.

Revenue
$45,231
+12.5%

Bounce Rate (Down)

Metric card with a negative trend direction.

Bounce Rate
24.3%
-3.2%

Users

Active user count with upward trend.

Users
2,341
+8.1%

Orders

Order volume metric with strong positive trend.

Orders
1,204
+23%

Dashboard Row

Multiple stat cards arranged in a grid for a dashboard overview.

Visitors
12,847
+5.2%
Conversion
3.8%
-0.4%

Usage

<StatCard label="Revenue" value="$45,231" icon="dollar-sign" trend="+12.5%" trendDirection="up" /><StatCard label="Bounce Rate" value="24.3%" icon="trending-down" trend="-3.2%" trendDirection="down" />

Props

PropTypeDefaultDescription
labeltext"Metric"Name of the metric
valuetext"0"Display value
icontext""Lucide icon name
trendtext""Trend percentage text
trendDirectiontext"up"Trend arrow direction: up, down