Skip to main content

StatCard

StatCard — Prism component.

Signature
Density
Viewport
Theme follows the navbar ☀/☾ toggle
Live demo
Open ↗

When to use

StatCard — Prism component.

Accessibility

When the whole card is actionable, expose a single accessible name and make it reachable with Tab + Enter. Decorative imagery uses empty alt.

Import

const { StatCard } = window.PrismDesignSystem_39d121;

Props

PropTypeRequiredDescription
titleReact.ReactNode
iconReact.ReactNode
statsStatItem[]YesTwo related metrics shown side by side with a divider.
classNamestring