Stat Card
KPI tile: uppercase label, large tabular value, optional icon, hint and monochrome delta arrow.
App patternsregistry:component
Install
npx shadcn@latest add @sav/stat-cardNeeds "@sav": "https://design.sasv.ch/r/{name}.json" under registries in components.json. Direct URL: /r/stat-card.json.
Preview
Flight hours312.4↑ 8.2 %this month
Open invoices7↓ 2CHF 4'980
Active members48→ 0
Aircraft51 in maintenance
Files
- registry/sav/components/stat-card.tsx→ @components/stat-card.tsx
Dependencies
Registry items
npm packages
cn, lucide-react