First Identity / Guides / Visual Identity

How to Choose Brand Colours That Work on Screen

A practical method for building a colour palette that is distinctive, accessible and usable in product UI.

Published by Technically Creative · Written for UK startups

How to Choose Brand Colours That Work on Screen

Colour is often the fastest route to recognition. It is also where many young brands make avoidable mistakes.

Start with the category

Map the colours your competitors use. FinTech leans blue and green. Wellness leans soft neutrals. You can follow the convention to signal you belong, or break it to stand out. Either is valid if it is deliberate.

Build a working palette

  • One lead colour that does the recognition work.
  • Neutrals for text and backgrounds. You will use these most.
  • One or two accents for calls to action and highlights.
  • Functional colours for success, warning and error states in product.

Check contrast

Text must be readable. Test combinations against the WCAG contrast requirements. A beautiful pale yellow on white fails immediately.

Test in context

A colour that looks great on a mood board can feel overwhelming on a full web page. Mock up a homepage, a slide and a mobile screen before committing.

Record the values

Guidelines should list HEX and RGB for screen and CMYK or Pantone for print. See what brand guidelines should include.

One strong choice

A single confident colour used consistently beats a rainbow. It is one of the cheapest ways to build a distinctive identity.

Looking for an agency? Read the full shortlist on First Identity.

Related guides