Search

Search components and blocks

Sign in

Analytics Blocks

Dashboards and trackers that make numbers easy to scan.

Stat Number Cards

Four headline numbers in a single row (two-by-two on medium widths, one column on phones). Each card pairs a large count-up figure with a trend arrow and a sparkline that draws itself in, then fills with a soft tint. Cards enter with a staggered spring, lift on hover, and the trend arrow nudges forward.

pnpm dlx shadcn@latest add @ditherui/stat-number-cards
Revenue12.4%

$0.0K

Active users8.1%

0

Conversion2.3%

0.0%

Orders5.6%

0

Install

$ pnpm dlx shadcn@latest add @ditherui/stat-number-cards

Props

className / ...div propsHTMLMotionProps<"div">—

Suggested components