# Colour

> Chartory colours come in two layers. The palette holds fourteen colour families in eleven steps. The roles name what a colour is for and point at a palette step in each mode, so a theme moves every Hearth chart at once. Every role below shows its contrast on the canvas in both Chartory modes.

## Palette

Fourteen families, **50 to 950**. Roles point at these steps; components never use a step directly.

- neutral
- red
- orange
- amber
- yellow
- green
- teal
- cyan
- sky
- blue
- indigo
- violet
- fuchsia
- pink

## Roles

A role names the job, **text/primary** or **data/cat-2**, and resolves to a palette step per mode. Contrast is measured on bg/canvas in each mode.

### Surfaces

- `bg/canvas`
- `bg/canvas-raised`
- `surface/panel`
- `surface/card`
- `surface/inset`
- `surface/inverse`

### Lines

- `stroke/divider`
- `stroke/card`
- `stroke/input`

### Text

- `text/primary`
- `text/secondary`
- `text/tertiary`
- `text/disabled`

### Status

- `status/success`
- `status/warning`
- `status/danger`
- `status/info`

### Data

- `data/primary`
- `data/cat-1`
- `data/cat-2`
- `data/cat-3`
- `data/cat-4`
- `data/cat-5`
- `data/cat-6`

## Contrast

- **Text roles** are measured against 4.5:1 on the canvas, the WCAG 2.2 AA level for body text; disabled text is exempt.
- **Marks, lines and status** are measured against 3:1 on the canvas (WCAG 1.4.11, non-text contrast). A value under its target shows in the warning colour.
- **Ramp steps** (data/seq-*) are cell fills, not marks; values on them use text/on-tint.
- **Colour never carries meaning alone**: every series has a legend or a direct label, and status pairs a colour with an icon or a sign.