Semantic colours must not be borrowed for decoration
Aliases: decorative status colour · incidental colour coding
What it is
Checkout wears a promo strip in the same red as failed validation. Shoppers never finish the words “discount applied”; they hunt for the field they got wrong, and some leave. Once a status hue is borrowed as decoration, the status leaks onto unrelated surfaces. The mapping table is intact; the same flare is being used as fireworks.
Why it happens
Attention treats categorical colour anywhere in view as candidate evidence. Error red does not “belong” only to the error component — across the page it still says something is wrong. Promo bands, chart series and illustration strokes that walk into that bin trigger incidental colour coding: the colour was meant to be meaningless, but a trained classifier reads it as status.
Charts hide it well. Paint “failure count” with success green and a rising line looks like improvement. The closer the decorative use sits in hue and chroma to the status colour, the stronger the leak; drop chroma or leave the status bins and the leak falls.
Studying it
Run an interference task: one real error and one same-hue decoration on the page. Measure first landing point and the spoken answer to “what do you think is wrong?”. Independent variables: hue distance between decoration and error, decorative area, presence of an icon. Dependent variables: false alarms as “error”, time to the real error, whether gaze is captured by the strip.
Do not use “how nice it looks” as the dependent measure. A handsome red band can still be a status false alarm.
Where it stops holding
- On interfaces that never trained a status mapping, decorative red is not read as error; leakage presupposes the mapping.
- Small, low-chroma decoration far from forms lowers false alarms — but “it’s only an accent” is not a waiver. Measure it.
- Using a brand primary that is not the status red for large-area identity is not borrowing. The dangerous stroke is the one that shares the error or success hue.
- With colour-vision deficiency, decoration and status collide more readily because fewer hue bins remain separable.
Applying it
- Ban status-table hues from promo strips, empty-state illustration, chart series and skeletons — anything that is not a state.
- Give chart series a different hue set, or split the code onto dash pattern and point shape, so a green line does not mean “good”.
- In review, print status colours and decorative colours on one sheet; if a pair cannot be told apart, change the decoration, not the status table.
- How to check: show new users a checkout with the decorative red strip and ask “is there an error right now?”. If anyone starts hunting validation, recolour the strip.
Related
- Same group: F5.02.1 Success, warning, error and info need a stable mapping · F5.02.3 Semantic colours need lightness remapped in dark mode
- Nearby: F5.03 Brand colour and functional colour · J2.03 Information does not rely on colour alone
- Search terms:
incidental colour coding·semantic color collision·status colour