Most palettes are chosen the wrong way round. Somebody picks five colours they like, arranges them on a swatch card, and only later discovers that none of them can carry white text, or that the “secondary” colour is unusable next to the primary one.

Build it in the order the interface needs

1. Text colour first. Near-black, slightly tinted towards your brand hue. Pure black reads as cheap on screens.
2. Surface colours next. A page background and one raised surface. If they are too close, cards disappear; too far and the page looks striped.
3. Then the primary action colour. It has one job: to be the most clickable thing on the page. Check white text on it before you fall in love.
4. A border colour. Quiet, low contrast, but visible on both surfaces.
5. Only then an accent. Used for perhaps two percent of the page. If you need more than one accent, you probably need fewer sections.

Test the awkward states early

Disabled buttons, error text on a coloured background, a link inside a dark footer, a badge on a hover state. These are where palettes break, and they never appear on the moodboard.

Name by role, not by colour

Call it --primary, not --indigo. The day the brand shifts to green, you rename nothing. It is a two-second decision at the start that saves a two-day search-and-replace later.

Six colours, chosen in that order, will carry an entire marketing site. Everything beyond that is decoration, and decoration is best added deliberately rather than inherited from a swatch card.