Dashboards with KPI cards and charts

Dashboard references are strongest when they show how metrics, chart summaries, and tables work together. Fudge can search captured UI classifications for dashboard pages, KPI components, chart components, typography roles, and supporting visual structure. Useful references Patterns to borrow - Put the primary metric in the card's largest type, then keep the label, delta, and comparison period secondary. - Use charts to explain movement or distribution, not to compete with the KPI number. - Keep

Show dashboards with KPI cards and charts using Fudge.

Dashboard references are strongest when they show how metrics, chart summaries, and tables work together. Fudge can search captured UI classifications for dashboard pages, KPI components, chart components, typography roles, and supporting visual structure.

Useful references

Patterns to borrow

  • Put the primary metric in the card's largest type, then keep the label, delta, and comparison period secondary.
  • Use charts to explain movement or distribution, not to compete with the KPI number.
  • Keep chart panels and tables aligned to the same grid so the page feels operational instead of decorative.
  • Reserve color for status, deltas, and selected series; neutral surfaces keep dense dashboards easier to scan.

design.md

Start with metric hierarchy, then chart density, then table or activity detail. Use typography, spacing, and restrained color so primary numbers are scannable before the eye moves into chart panels.

Captured pages