Metric Cards
A row of KPI cards with count-up values, trend chips, and sparklines that draw in.
Performance
Realtime overview, updated continuously
Live
Net revenue
+14.2%
$0
vs. previous 7 days
Active users
+6.1%
0
vs. previous 7 days
Conversion
+0.8%
0.00%
vs. previous 7 days
Trial signups
-3.1%
0
vs. previous 7 days
Usage: paste this file into your project (e.g.
components/metric-card-group.tsx), make sure framer-motion, clsx and tailwind-merge are installed, and add the cn() helper from the docs.