Ask
21
@a11y_anneke ·

Our brand colour is green and we also use green to mean success — is that a problem or am I overthinking it?

Our design system's primary colour is green. It is on the buttons, the links, the active states, the logo, everything. It is simply what our product looks like.

I realised this week that we also use green for success states — a task completed, a service running, a connection healthy. So the same colour means both "this is our brand" and "this is working".

On one screen we have a green button next to a green status dot and they mean unrelated things. Is this an actual problem, or is context enough to carry it?

4 answers Share
Report

Answering anonymously — a moderator will review it first.

  • @a11y_anneke · 2w ago

    The accessibility argument arrives at the same fix by a shorter route: never encode meaning in colour alone, brand collision or not.

    Around one in twelve men has some form of colour vision deficiency, and red-green is by far the most common. A green dot and a red dot are, for a meaningful fraction of your users, two dots. Everything else — greyscale printing, bright sunlight on a phone, a cheap monitor, a screen reader — degrades colour-only signals too.

    So status needs a second channel regardless. Word, icon shape, position, or all three. Once you have done that for accessibility reasons, the brand collision is already solved as a side effect, which is a nice case of the two concerns pointing the same way.

    One practical tip: use different shapes for status, not just different colours. A filled circle for running, a hollow circle for stopped, a triangle for warning. Distinguishable with no colour perception at all.

    25
    Share
    Reply

    Answering anonymously — a moderator will review it first.

    Report
  • @pricing_pelin · 2w ago

    There is a variant of this worth checking while you are in there: what does your green mean when something goes wrong?

    If green is the brand colour, teams often end up using it for primary buttons everywhere — including the confirm button on destructive dialogs, because that is what the primary button looks like. Now "Delete everything" is green, which reads as reassurance.

    That is a more serious version of your problem, and it shows up in exactly the moments where you least want ambiguity. Worth auditing your destructive flows specifically rather than only the status indicators.

    18
    Share
    Reply

    Answering anonymously — a moderator will review it first.

    Report
  • @research_rosa · 2w ago

    It is a real problem, though not usually a severe one, and it has a clean fix that does not require abandoning your brand colour.

    The issue is that status and interaction are two different channels of meaning and you are sending both down the same wire. On a busy screen the eye scans for colour first, so a green button and a green status dot compete: is that thing clickable, is it working, or both?

    The fix is to stop relying on hue to distinguish them and use form instead.

    • Interactive elements are shapes you can press — filled, with a border, with a label.
    • Status is a small dot, a badge, a pill, always accompanied by a word.

    Once a status is always "● Running" and never a bare dot, the colour is decoration on top of information rather than the information itself. The collision stops mattering because the colour was not carrying the load.

    26
    Share
    Reply

    Answering anonymously — a moderator will review it first.

    Report
  • @wireframe_wren · 2w ago

    If you do want a colour distinction as well as a structural one, the usual move is to keep the brand green for interaction and shift status green to a different value — more saturated, or noticeably darker or lighter.

    It is subtle, it does not break the brand, and combined with the shape and label changes above it is more than enough. What does not work is picking a completely different hue for success, because green means working to nearly everyone and fighting that is a losing battle even for a brand.

    14
    Share
    Reply

    Answering anonymously — a moderator will review it first.

    Report