Color Palette Generator

Generate color palettes, lock the ones you like, and export to CSS, Tailwind or JSON.

Build a Color Palette in Seconds

This color palette generator helps you create a cohesive set of colors for a website, brand or design project. Press generate (or the space bar) to roll a new palette, lock the colors you want to keep, and generate again until the rest fit. You can pull a palette straight from an image, explore classic harmony schemes from any base color, and copy each value or export the whole set as code. Everything runs in your browser, so nothing is uploaded.

How to use the generator

  1. Generate a starting palette, or press the space bar to reroll.
  2. Lock the colors you like so they stay while you reroll the others.
  3. Refine using the base color picker and harmony schemes, or extract colors from an image.
  4. Export to CSS variables, Tailwind, SCSS or JSON, or copy any single value.

Color harmony, simplified

Harmonies are reliable recipes for colors that look good together. Complementary pairs opposite hues for strong contrast. Analogous uses neighbours on the color wheel for a calm, unified feel. Triadic and tetradic spread colors evenly for balanced, vibrant schemes, while monochromatic varies the lightness of a single hue for a clean, minimal look. Pick a base color and the generator builds each scheme for you.

Pull colors from an image

Have a photo, logo or screenshot you love? Use From image to extract its dominant colors into a palette. The image is read locally in your browser and never sent anywhere, so brand assets and private images stay on your device.

Share and reuse your palette

Your palette is saved in the page URL as you work, so you can bookmark it or paste the link to a teammate and they will see the exact same colors. Export options drop straight into your stylesheet or design tokens, keeping colors consistent across a project.

Frequently asked questions

How do I keep a color while generating new ones?

Click the lock icon on any swatch. Locked colors stay put when you press generate or the space bar, so you can settle one color at a time.

Can I create a palette from a photo?

Yes. Use the From image button to extract the dominant colors from any picture. The image is processed in your browser and never uploaded.

How do I export my palette?

Choose CSS, SCSS, Tailwind or JSON in the export panel and copy the code, or click any individual swatch to copy its hex value.

What is the difference between the harmony schemes?

Each scheme spaces colors differently around the color wheel: complementary for contrast, analogous for harmony, triadic and tetradic for balance, and monochromatic for shades of one hue.

Can I share a palette with someone?

Yes. The palette is encoded in the page URL, so you can bookmark it or send the link and the recipient sees the same colors.