← Back to docs
Recipe

North Star Dashboard

A single-screen command center that surfaces the one metric that matters most — your north star — alongside supporting KPIs, recent events, and system health.

Ingredients

  • One primary metric card (north star) — large, centered, live-updating
  • 3–5 secondary KPI tiles in a row beneath
  • Recent activity feed (last 20 events)
  • System status indicators (API latency, error rate, uptime)
  • Time-range selector (24h / 7d / 30d)

Layout

Time range
24h7d30d

North Star

12,847

↑ 8.2% vs last period

Revenue

—

Users

—

Conv.

—

Churn

—

Recent Activity

System Health

API 42msUptime 99.9%

Notes

The north star metric should be the single number that best captures value delivery for your product. Everything else on screen exists to provide context for that number. Keep the dashboard free of navigation — it is a terminal, not a portal. Auto-refresh every 60 seconds. Use skeleton placeholders during initial load to avoid layout shift.