# Colour

Two grounds, one accent. Every value here is copied from `assets/brand.css` on
archbotics.com, which is what shipped. `colors.json` carries the same table in machine form,
including every contrast ratio on this page.

**What the accent means, in one line: ember marks the threshold, the one place a human acts.**
On the light ground that is the single primary call to action per view, the rung of the mark,
index marks and the focus ring. On the dark ground the accent never fills anything: marks, the
rung, one line of text at most, the focus ring.

Warm neutrals throughout. No blue anywhere, no second hue, no gradient, no glow.

## The light ground, called paper

| Token | Value | Role |
|---|---|---|
| `--paper` | `#F6F3EC` | The ground |
| `--paper-1` | `#EEEAE0` | The raised band on it, felt rather than seen |
| `--paper-line` | `rgba(20, 18, 15, .10)` | Hairline, `#DFDDD6` once composited |
| `--paper-line-2` | `rgba(20, 18, 15, .22)` | The stronger hairline for frames, `#C4C2BB` composited |
| `--paper-ink` | `#14120F` | Headings and the mark |
| `--paper-ink-body` | `#3A3631` | Body text |
| `--paper-ink-mute` | `#5E5850` | The label voice |
| `--paper-ink-dim` | `#6F6862` | Metadata and captions. The floor: nothing lighter carries text |

## The dark ground, called night

| Token | Value | Role |
|---|---|---|
| `--night` | `#0E0D0B` | The ground |
| `--night-1` | `#151310` | The raised band on it |
| `--night-line` | `rgba(243, 239, 230, .10)` | Hairline, `#252421` composited |
| `--night-line-2` | `rgba(243, 239, 230, .22)` | The stronger hairline for frames, `#403F3B` composited |
| `--night-ink` | `#F3EFE6` | Headings and the mark |
| `--night-ink-body` | `#D6D0C4` | Body text |
| `--night-ink-mute` | `#A39C90` | The label voice |
| `--night-ink-dim` | `#857E73` | Metadata and captions. The floor |

## The accent, called ember

| Token | Value | Role |
|---|---|---|
| `--ember` | `#C64518` | Fills and headline-size text on the light ground |
| `--ember-ink` | `#B53E13` | Accent text at body size and under on the light ground |
| `--ember-light` | `#FF7A50` | Accent marks and text on the dark ground |

Three values, one accent. They are the same colour adjusted so it reads at the size and on the
ground where it is used, which is why the pack has no fourth ember and why none of the three is
interchangeable with another.

## Contrast pairs

Measured, not estimated. WCAG 2.1 AA wants 4.5:1 for text at body size and 3:1 for text at
24 px and over (or 18.66 px bold).

| Foreground | Ground | Ratio | AA body | AA large |
|---|---|---|---|---|
| `--paper-ink` | `--paper` | 16.87 | pass | pass |
| `--paper-ink` | `--paper-1` | 15.56 | pass | pass |
| `--paper-ink-body` | `--paper` | 10.82 | pass | pass |
| `--paper-ink-body` | `--paper-1` | 9.98 | pass | pass |
| `--paper-ink-mute` | `--paper` | 6.34 | pass | pass |
| `--paper-ink-mute` | `--paper-1` | 5.85 | pass | pass |
| `--paper-ink-dim` | `--paper` | 4.94 | pass | pass |
| `--paper-ink-dim` | `--paper-1` | 4.56 | pass | pass |
| `--ember` | `--paper` | 4.44 | fail | pass |
| `--ember` | `--paper-1` | 4.10 | fail | pass |
| `--ember-ink` | `--paper` | 5.17 | pass | pass |
| `--ember-ink` | `--paper-1` | 4.77 | pass | pass |
| `--night-ink` | `--night` | 16.93 | pass | pass |
| `--night-ink` | `--night-1` | 16.16 | pass | pass |
| `--night-ink-body` | `--night` | 12.65 | pass | pass |
| `--night-ink-body` | `--night-1` | 12.08 | pass | pass |
| `--night-ink-mute` | `--night` | 7.14 | pass | pass |
| `--night-ink-mute` | `--night-1` | 6.81 | pass | pass |
| `--night-ink-dim` | `--night` | 4.84 | pass | pass |
| `--night-ink-dim` | `--night-1` | 4.62 | pass | pass |
| `--ember-light` | `--night` | 7.54 | pass | pass |
| `--ember-light` | `--night-1` | 7.20 | pass | pass |
| `--ember` | `--night` | 3.95 | fail | pass |
| `#FFFFFF` | `--ember` | 4.92 | pass | pass |

The two rows that matter most:

1. **`--ember` fails AA for text at body size on paper (4.44).** That is exactly why
   `--ember-ink` exists. Use `--ember` for fills and for headline-size text, `--ember-ink`
   for anything smaller.
2. **`--ember` fails on night (3.95).** Use `--ember-light` there. This is the whole reason
   the dark ground has an accent of its own.

The step between a ground and its raised band is deliberately below the threshold of
noticing: 1.084:1 on paper, 1.048:1 on night. A band is felt as a change of plane, not seen
as a different colour. Do not increase it to make it visible.
