Colour Palette Picker

A colour palette is a small set of colours that go well together. Designers use palettes to keep websites, logos, posters, and anything else visual looking consistent. Instead of guessing, a palette gives you colours already proven to complement each other.

Click Generate New Palette and you'll instantly get a set of matching colours. You can also press the Space bar as a shortcut. Keep clicking until you see something you love.

The colour style controls what kind of palette gets made:

• Mix It Up — completely random. Good for exploring and getting inspired.
• Neighbours — colours that sit close together on the colour wheel. They feel calm, soft, and easy on the eye.
• Opposites — colours from opposite sides of the wheel. Bold and high contrast — great for things you want to stand out.
• Balanced — three distinct colours spread evenly around the wheel. Vibrant but still balanced.
• Soft Contrast — like Opposites but less intense. A gentler mix of contrasting colours.
• One Colour — light and dark versions of a single colour. Clean, minimal, and very professional looking.

Click anywhere on the colour box and a colour picker will pop up. Choose any colour you like. You can also click Shades on any colour to see lighter and darker versions of it, then pick one to swap it in.

When you click the padlock icon on a colour, it gets locked. Locked colours stay exactly as they are when you generate a new palette — only the unlocked ones get replaced. This is really handy when you've found a colour you love but want the tool to find better matches for the rest.

Shades are lighter and darker versions of the same colour. Navy blue, sky blue, and baby blue are all shades of blue. Click Shades on any colour box to see a full range from very dark to very light. Click any shade to use it in your palette.

Click the code at the bottom of any colour box (the one that looks like #AABB00) to copy that colour. Or click Copy All to grab every colour in your palette at once, ready to paste into Figma, Canva, CSS, or anywhere else.

Yes — your palette is always saved in the page URL. Just copy the web address from your browser and send it to anyone. When they open the link they'll see exactly the same palette.

A hex code is just a short way of writing a specific colour — for example #FF5733 is a shade of orange-red. Designers and developers use hex codes to specify exact colours in tools like Figma, Canva, Photoshop, or in website code.