Success, warning, error and info need a stable mapping
Aliases: status colour · semantic colour · success-warning-error
What it is
A “saved” toast was green last week and amber this week, because another squad thought completion felt more like a reminder. People stop treating the colour as a signal and start reading the sentence. Semantic colour binds success, warning, error and information to fixed hue categories so status is a learnable code, not a fresh guess every time.
What stays fixed is the category, not one immortal hex.
Why it happens
Repeated co-occurrence files colour and outcome into classes: green ≈ passed, red ≈ blocked, amber ≈ look at this, blue ≈ fyi. That is categorical colour coding. It is trained by consistency, not by a moral meaning baked into the spectrum. Once the mapping exists, the next instance can be classified before the copy is read — if the hue lands in the right bin. If the mapping moves week to week, the classifier fails and colour falls back to decoration.
The four classes also have to be separable. If success and info share a calm blue-green, and warning and error share a warm hue, people hesitate on “must I act now?”. Separability is hue distance plus role binding, not four equally loud saturations.
Studying it
Use a classification task, not a preference rating. Briefly show a captionless bar, or a notice with neutral wording, and ask for success / warning / error / info. Independent variables: whether the mapping holds within the session, hue distance between classes, presence of an icon. Dependent variables: accuracy, response time, confidence. Retest across sessions to see whether an unstable mapping returns accuracy to chance.
Lab “red = error” often comes from the observers’ cultural habit. Do not export it to markets where up/down colour is reversed — that is a different convention, not this status taxonomy.
Where it stops holding
- A stable mapping does not let you drop text or shape for colour-vision-deficient users.
- One-off landing pages and outbound mail that never trained the habit gain little from freezing the four hues.
- Some products have no fourth “info” class; forcing four colours invents a fake state.
- The mapping is about recognising status, not about whether the brand is recognisable.
Applying it
- Give success, warning, error and info each a hue bin; toasts, inline validation and badges share one table.
- Do not let a product line privately recolour “save succeeded”. Change the whole table and retire old instances together.
- Lay the four classes on one background and check that, without type, they still split into pass / attend / fail / inform.
- How to check: strip the copy, keep the colour bar, ask someone outside the design team to classify. If one class is regularly named as another, increase hue distance rather than writing a longer sentence.