# Dashboards

## Purpose

Composing data-heavy screens.

## Decisions

### Dashboards

- **Layout depends on what the dashboard needs.** Two layouts are standard: a **row of stat cards on top with a chart and a table side by side below**, and **one large main chart with a column of stats beside it**. An even grid of equal cards is not a standard (it still works as a general flowing layout under [Layout and Grid](../foundations/layout-and-grid.md)).
- **Stat cards come in two kinds, picked by purpose:**
  - **Number with a change indicator** (an arrow, coloured emerald when good and red-pink when bad, with the text staying soft white) for **comparison against a set point**, such as against an average or last week.
  - **Number with a small trend line** for **a trend over time**, such as users over a month.
  - A number alone is not used.
- Numbers use the heading type; labels are small grey text. Charts follow [Imagery and Illustration](../foundations/imagery-and-illustration.md) (rounded 4px bar tops, faint gridlines).