Tailwind CSS KPI and Stat Card Components

Use these Tailwind CSS KPI and stat card components and examples to show the numbers that matter in your dashboard. Each one supports light and dark mode, comes as a React component too, and says what every figure counts, over which period and against what, with changes that never rely on colour alone. From stat cards with change badges to sparklines, usage limits, goals, period comparisons, channel breakdowns and a big metric with a range picker, everything is easy to customize and use.

Stat Cards with Change

Edit with AI
Loading...

Hairline KPI Strip

Edit with AI
Loading...

Sparkline KPI Cards

Edit with AI
Loading...

Get the whole library.

Every premium component and block, the Next.js sites, all themes and AI edits, in one plan.

See pricing

Not the one you need?

Describe it, and AI builds it like the designs in our library, ready to edit and copy.