shadcnblocks

Kibo UI spinner using the throbber animation variant for a classic rotating loader icon in a centered layout.

Spinner using the pinwheel animation variant.

Spinner using the pulsing ring variant.

Multiple Kibo UI spinner sizes side by side.

Kibo UI Spinner using the default variant.

Small Spinner.

Large Spinner.

Primary Color Spinner.

Muted Spinner.

Spinner using the throbber animation variant.

Three linked metric cards in a responsive grid, each displaying an avatar, company logo, large stat number, and short description with hover elevation effects.

A stats section with a headline, four metrics in a two-column grid, a primary-tinted gradient background, vertical line grid pattern, and a large decorative circle element.

A two-column stats section with a heading, chart, and call to action beside a large animated revenue figure that toggles monthly and yearly values.

A centered heading above four animated comparison bars, with one highlighted column showing a conversions tooltip and percentage.

Animated countdown display showing days, hours, minutes, and seconds inside a decorated container with a call-to-action button.

A heading, two buttons, and four animated figures next to year-range pills that update the numbers and a connecting line.

A centered heading and pill label above a line chart, followed by three key figures with short descriptions.

A centered heading above a two-column layout with a radial visitor chart and three stacked key figures.

A centered heading and pill label above a radar chart, followed by three key figures with short descriptions.

A sticky milestones label beside a stacked list of large figures, each paired with a supporting paragraph and a bottom border.

A centered heading above three large performance figures, each with a short label above and a supporting phrase below.

Animated fiscal-year KPIs above a ruler-style baseline with default and secondary CTAs. Year pills stay in chronological order and use light horizontal motion when selected.

A centered heading above a six-card grid of stats, each pairing a trend icon with a value and a short description.

Inline rating strip showing star scores and platform logos for Apple Store, Play Store, and Trustpilot.

Three bold percentage figures with trend icons and labels, arranged in a row beneath a large heading.

A left-aligned heading and two call-to-action buttons above a four-column row of large figures with metric labels.

A bordered card of weekly metrics, each with a labeled progress bar, colored trend arrow, and week-over-week comparison.

A heading, description, and linked call to action above a four-column grid of large stat figures with labels.

A two-column section with a badge, heading, and three inline metrics beside a four-card feature grid.

A metric card with a colored left border accent and pill badge showing percentage change.

A compact metric card displaying a value with trend indicator showing percentage change and direction.

A metric card with a sparkline area chart showing recent trend data below the main value.

A metric card showing progress toward a goal with a progress bar and target value.

A metric card displaying current and previous period values side by side for easy comparison.

A metric card with a colored icon badge in the header alongside the title and value.

A metric card showing a total value with a breakdown list of contributing segments below.

A metric card with a mini donut chart showing percentage completion alongside the value.

A metric card with a color-coded status indicator showing healthy, warning, or critical states.

A metric card with MRR/ARR toggle to switch between monthly and annual recurring revenue views.

Online status with custom StatusLabel children text.

Degraded status badge for partial outages.

Maintenance status badge for scheduled downtime.

Offline status badge with indicator and default label.

Online status badge with indicator and default label.

Stepper steps annotated with Badge labels for required or optional stages.

Ecommerce-style checkout stepper with order summary cards per step.

Stepper with earlier steps marked completed via the completed prop.

Minimal indicators with richer content panels and a step counter.