Kasel Creative

Using Colour With Intent in Branding and UI

There is a lot written about what colours "mean". Most of it is cultural, contextual and weaker than claimed. The useful part of colour work is not symbolism — it is discipline: a small palette, clear roles, and enough contrast.

Build a palette with roles, not a mood board

  • A primary brand colour, used sparingly for the things that matter most.
  • Neutrals — a near-black, a near-white, and a few greys — which do most of the actual work on a page.
  • Functional colours for success, warning and error states in a UI.
  • Optionally one or two secondary colours for accents and illustration.

That is usually the whole system. A brand does not need twelve colours; it needs a few used consistently.

The primary colour is loudest when it is rare

If everything is the brand colour, nothing stands out. Reserve it for the single most important action on a screen — the main button, a key highlight — and let neutrals carry the rest. A page that is 90% neutral with one strong accent reads as confident.

Contrast is not optional

Text needs sufficient contrast against its background to be readable — a ratio of at least 4.5:1 for body text. This is an accessibility requirement in many contexts and simply good practice everywhere. Check it during design, not after a complaint.

Test colour in context, on real screens

Colours shift with the surrounding colours, the screen, the lighting and dark mode. A palette that looks balanced in a design tool can feel garish on a phone in sunlight. Review it on actual devices before committing.

In short

Small palette, defined roles, primary colour used rarely, contrast checked. That is most of colour done well — the symbolism is secondary. It is part of every brand system we build; see how a restrained palette holds up.