Colour palettes
Browse hand-picked four-colour palettes by mood and copy any hex with a click, with each palette checked for colour-blind readers.
Palettes chosen rather than generated, four colours each, filtered by the mood you are after — pastel, vintage, neon, earth, night. Click any band to copy its hex, or take all four at once. Each one is also checked for something this kind of gallery normally ignores: whether two of its colours become the same colour for a reader with red-green colour blindness.
How the palettes are checked
Every palette here was picked by hand and holds four colours as hex codes. Choosing a mood filters the list by its tags, and Shuffle puts the whole set in a random order that holds still while you read. The Safe badge is calculated in the page rather than typed into the data: each of the four colours is run through the Machado, Oliveira and Fernandes model of deuteranopia, the commonest red-green colour blindness, at full strength and in linear light, and every pair of results is compared by CIE76 colour difference. If any two land closer than 10, about where a difference stops being obvious at a glance, the palette gets no badge. Each band is labelled in black or white, whichever reads better on it; clicking a band copies its hex, and Copy all four copies the four codes in one line, separated by commas.
Limits
The badge covers one kind of colour blindness, deuteranopia at full strength. Protanopia behaves much like it, but tritanopia and milder forms are not checked here; the colour blindness simulator shows those. A pass also says nothing about contrast between text and background, which is a question for the contrast checker. Every palette is exactly four colours, with no tints or shades; build those in the palette generator or in Shades and tints. Copying gives hex only, with no RGB, HSL or colour names, and the ready-made CSS and Tailwind exports live in the generator. There is no search by colour and no way to save favourites, because nothing about your visit is stored.
How to use it
- Pick a mood, or shuffle for something you were not looking for.
- Click a band to copy that colour, or Copy all four for the set.
- Send one to the generator to lock a colour and build around it.
Why use this tool
Completely private
Everything runs inside your browser. Your files and text are never sent to a server.
Free, with no limits
No sign-up, no watermarks and no cap on how many times you can use it.
Instant results
There is no upload or queue to wait for, so results appear as fast as your device can work.
Works on any device
Runs in any modern browser on phone, tablet or desktop. Nothing to install.
Frequently asked questions
- How do I copy a palette's hex codes?
- Click one band to copy that colour, or Copy all four to get the whole palette in one line, the four codes separated by commas, ready to paste into a design tool or a stylesheet comment.
- Why does a palette that looks fine to me have no Safe badge?
- Because the check is made for a different eye. Two of its colours, often a red and a green of similar lightness, end up less than 10 apart once deuteranopia is simulated, which is too close to tell apart at a glance. The palette still works for decoration; just do not let those two colours carry different meanings.
- Can I get a palette as CSS variables?
- Not on this page, which copies hex codes. Press the wand button on the palette: it opens in the palette generator with the four colours loaded, and that exports them as CSS or as a Tailwind config.
- What does the Safe badge mean?
- That no two colours in the palette collapse into one for a reader with red-green colour blindness, which affects roughly one man in twelve. It is worked out from the colours themselves, not typed in by hand: each one is put through a simulation of how that eye sees it and the results are compared. A palette without the badge is not bad — it is fine for decoration — but do not use it to mean anything, like pass and fail.
- Can I use these commercially?
- Yes, without restriction. A colour is not copyrightable and neither is a list of four of them. Use them in client work, products, anything.
- Why four colours and not five?
- Because four is what you can actually hold in your head and use. Most palette galleries settle on four for the same reason: it is enough for a background, a surface, a text colour and an accent, which is a whole interface.
- How do I build on one?
- Send it to the palette generator with the wand button. It opens with those colours loaded, and from there you can lock the ones you want, reroll the rest and export the result as CSS or Tailwind.
- Are new palettes added?
- These are picked by hand, so the set grows when there is something worth adding rather than on a schedule. There is no voting or submission, which also means there is nothing to sign up for and no account to have.
Related tools
Palette generator
Five colours that go together. Lock the good ones, reroll the rest.
Colour from an image
Take any colour out of a picture, or the whole palette at once.
Colour picker
One colour, every code, and what goes with it.
Colour mixer
Mix two colours and see what you actually get.
CSS gradient generator
Build a gradient that stays colourful in the middle.
Contrast checker
Check whether text can actually be read on its background.
Favicon generator
Turn a logo into favicon.ico and every icon a site needs.