Color palette generators for designers

11 picks · Updated

A palette generator gives you a starting point. A UI also needs the boring part: shades for every color, enough contrast for text, and states for hover and disabled.

So this list has both kinds. Quick generators for finding colors you like, and tools that turn those colors into a usable system.

  1. Coolors preview

    Coolors

    The super-fast color-scheme generator loved by millions.

    Coolors generates a palette with one key press and lets you lock the colors you like while it shuffles the rest. Fast, fun and good for early exploration.

    Good for: Fast palette exploration

  2. Realtime Colors preview

    Realtime Colors

    Visualize your color palette on a real website in real time.

    Realtime Colors shows your palette on a real website layout while you edit it. Seeing text, buttons and backgrounds together catches problems a row of swatches hides.

    Good for: Testing a palette on a real layout

  3. Huemint preview

    Huemint

    Use machine learning to generate color schemes for brands.

    Huemint uses machine learning to suggest palettes for a brand, a website or an illustration, and previews them in context. Good when you are stuck and want different directions.

    Good for: New palette directions for brands

  4. Adobe Color preview

    Adobe Color

    Create color schemes and explore trends from the community.

    Adobe Color builds palettes from color harmony rules and from photos, and has a contrast checker. It syncs with Adobe apps if you use them.

    Good for: Harmony rules and palettes from photos

  5. Khroma preview

    Khroma

    The AI color tool that learns which colors you like.

    Khroma learns which colors you like from a quick pick at the start, then suggests combinations based on that. More personal than random generators.

    Good for: Palettes tuned to your taste

  6. Leonardo preview

    Leonardo

    Generates accessible color palettes from target contrast ratios.

    Leonardo, from Adobe, builds color scales from target contrast ratios. You say how much contrast you need and it gives you colors that meet it, in light and dark themes.

    Good for: Accessible color systems

  7. Radix Colors preview

    Radix Colors

    A gorgeous, accessible color system for design systems.

    Radix Colors is a ready made color system with twelve steps per color, each step meant for a job: backgrounds, borders, solid fills, text. Light and dark versions match.

    Good for: A complete UI color system

  8. UI Colors preview

    UI Colors

    Generate and export Tailwind CSS color palettes.

    UI Colors turns one color into a full Tailwind CSS scale from 50 to 950 and exports it. Quick when you need a brand color in a Tailwind project.

    Good for: Tailwind color scales

  9. Happy Hues preview

    Happy Hues

    A color palette inspiration site that shows palettes in context.

    Happy Hues shows each palette applied to a full example site, with notes on which color goes where. Useful for learning how to assign colors, not only pick them.

    Good for: Learning where each color goes

  10. Color Hunt preview

    Color Hunt

    A free, open platform for color palette inspiration.

    Color Hunt is a big community collection of four color palettes. Good for browsing when you have no starting color at all.

    Good for: Browsing palettes for ideas

  11. OKLCH Color Picker preview

    OKLCH Color Picker

    OKLCH is a new way to encode colors (like hex, RGBA, or HSL)

    OKLCH Color Picker helps you work in OKLCH, a color space where lightness looks even across hues. That makes building consistent scales much easier than in HSL.

    Good for: Working in OKLCH

Questions

What is the best free color palette generator?
Coolors for quick exploration, Realtime Colors to test a palette on a real layout. Both are easy to start with.
How do I make an accessible color palette?
Start from contrast, not from looks. Leonardo builds colors from contrast targets, and Radix Colors gives you a scale where each step is meant for a specific use.
How do I get a Tailwind color scale from my brand color?
UI Colors turns one color into a full 50 to 950 scale and exports it for Tailwind.

Browse the full category

More guides