Generating palettes
- Coolors: press space, get a palette; lock the ones you like. The fastest way to explore.
- Adobe Color: harmony rules (complementary, triadic, analogous) on a proper wheel, plus extraction from images. Syncs to Creative Cloud.
- Khroma: learns your taste from fifty picks, then generates endless palettes you will actually like.
- Colormind: AI palettes trained on real designs, with a UI preview mode.
Browsing and inspiration
- Color Hunt: curated palettes, sortable by mood. Good for a starting point when the brief is vague.
- Happy Hues: palettes shown applied to a full page, which is how a palette should be judged.
- Pantone Connect: match screen colours to print standards. Essential once a brand goes to packaging or signage.
Refining and testing
- Realtime Colors: type in your palette and see it on a realistic website layout instantly. The best sanity check before committing.
- Paletton: old interface, excellent for building tints and shades systematically.
- ColorHexa: every conversion and variation of a single colour, with related schemes.
Accessibility
- WebAIM Contrast Checker: pass or fail for text against background under WCAG. Non-negotiable for any text colour.
- Accessible Palette: builds a full tint scale where every step has predictable contrast, which is how design systems should be made.
| Stage | Tool |
|---|---|
| Explore | Coolors, Khroma, Colormind |
| Harmonise | Adobe Color, Paletton |
| Preview | Realtime Colors, Happy Hues |
| Check | WebAIM, Accessible Palette |
| Pantone Connect |
Common questions
- What is the best free colour palette generator?
- Coolors for speed and Adobe Color for control. Both are free for the features most designers need.
- How do I check if my colours are accessible?
- Run each text and background pair through WebAIM's Contrast Checker. Body text needs 4.5:1, large text 3:1. Build the palette so those pairs pass rather than fixing them later.
- How many colours should a website palette have?
- One primary, one accent, and four to six neutrals for text, backgrounds and borders. Semantic colours for success, warning and error on top. More hues than that rarely improve a site.
