Components/Cards
intermediateFeature Stat Card
A card surface for displaying a short metric with strong information hierarchy.
statssurfacedashboard
Open itemReusable UI compositions such as cards, forms, navbars, and modal patterns. Use this domain when the problem is scoped to components work, then narrow into a category and specific references.
Each category groups references that solve a similar UI problem so the library feels more like a handbook than a flat archive.
Card layouts for information surfaces, stats, and supporting callouts.
Chart patterns for dashboards, reports, and lightweight analytics surfaces.
Form compositions for auth, contact, and focused data-entry flows.
Modal patterns for confirmation flows, warnings, and quick actions.
Navigation bars for product surfaces, docs experiences, and internal tools.
Browse every seeded item in this domain, then open the ones that need closer inspection.
A card surface for displaying a short metric with strong information hierarchy.
A testimonial card that emphasizes the user voice without excessive decoration.
A pricing card that balances plan name, pricing, feature bullets, and a high-emphasis CTA.
A compact area chart pattern for showing revenue movement across weekly or monthly ranges.
A donut chart pattern for showing top acquisition channels with an active legend state.
A stacked horizontal bar chart for comparing active versus draft reference volume across groups.
A dual-line chart for comparing current versus previous performance over one reporting range.
A vertical bar chart for comparing top categories, pages, or traffic sources in one view.
A compact KPI card with a small sparkline for showing one primary metric and its short-term movement.
A simple auth form with clear input hierarchy and a single primary CTA.
An inline form pattern for email capture that keeps the prompt and action in one compact row.
A confirmation modal with light hierarchy for actions that require clear user intent.
A higher-emphasis confirmation modal for destructive flows that need stronger caution cues.
A product navbar with brand, key links, and a CTA that stays visually clear.
A docs-oriented navbar that balances product identity, search, and top-level navigation links.