Back to cookbook
Recipe
Build a dashboard with GunjoUI
You need a metrics dashboard with stat cards, a chart area, and a recent-activity panel.
Recommended:
v0
Cursor
Prompt
Use the GunjoUI design system from @gunjo/ui. Reference the component manifest at https://gunjo.dev/api/specs/manifest. Build a dashboard page with: - A header with brand name on the left and a user avatar on the right - A 4-column grid of Card components (CardHeader/CardTitle/CardDescription/CardContent) for KPIs: Revenue, Subscriptions, Sales, Active Now. Use `text-2xl font-bold` for the metric value. - Below: a 7-column grid where a "Sales Analytics" Card spans 4 cols (chart placeholder inside) and a "Recent Sales" Card spans 3 cols (list of 5 user rows with Avatar + name + email + amount). All colors must use semantic tokens (bg-primary, text-foreground, bg-muted etc.) — never hardcoded hex.
Expected output
A working dashboard page using @gunjo/ui Card, Avatar, and layout primitives, fully token-driven.
Components used
Card
Avatar
DashboardTemplate