Color Palette Generator

Extract colors from images or create harmonious palettes

Drop an image here or click to upload

PNG, JPG, or WebP

Your Palette

Click a swatch to copy its HEX value. Use the lock icon to keep colors when regenerating.

Export

Color Theory Basics

Color theory is a framework for understanding how colors relate to each other and how they can be combined effectively. At its core is the color wheel, which arranges hues in a circle based on their wavelength relationships. Primary colors (red, yellow, blue in traditional theory, or red, green, blue in light) combine to create secondary and tertiary colors.

Three properties define any color: hue (the position on the color wheel), saturation (the intensity or purity of the color), and lightness (how bright or dark the color appears). Adjusting these properties is the key to building cohesive palettes.

How to Choose a Color Palette

  1. Start with your primary or brand color. This is the dominant color in your design.
  2. Choose a harmony rule (complementary, analogous, etc.) to generate supporting colors.
  3. Add neutral tones -- grays, off-whites, or dark shades -- for backgrounds, text, and spacing.
  4. Test your palette for sufficient contrast between text and backgrounds. Aim for at least a 4.5:1 ratio.
  5. Limit your active palette to 3-5 colors to maintain visual consistency across your design.

Color Harmony Types

Complementary

Uses two colors opposite each other on the wheel (180 degrees apart). Creates high contrast and visual energy. Good for calls to action and highlights, but use sparingly to avoid visual fatigue.

Analogous

Uses 2-4 colors adjacent on the wheel (30 degrees apart). Creates a harmonious, unified feel. Common in nature, it works well for calm and comfortable designs.

Triadic

Uses three colors evenly spaced at 120-degree intervals. Offers strong visual contrast while maintaining balance. Works well when one color dominates and the other two accent.

Split-complementary

Uses a base color plus the two colors adjacent to its complement (150 and 210 degrees). Offers contrast similar to complementary but with less tension. A good choice for beginners.

Monochromatic

Uses a single hue with variations in saturation and lightness. Creates a cohesive, elegant look. The easiest harmony to implement and virtually impossible to get wrong.

Frequently Asked Questions

How do I extract colors from an image?

Upload any image using the From Image tab. The tool samples pixels from across the image, groups similar colors together, and returns 5-8 dominant colors. Each color is shown as a swatch with its HEX, RGB, and HSL values for easy copying.

What are color harmony types?

Color harmonies are rules based on the color wheel that produce combinations that look visually pleasing. The five main types are complementary (opposites), analogous (neighbors), triadic (three equal intervals), split-complementary (base plus neighbors of its opposite), and monochromatic (one hue, varied lightness and saturation).

How do I choose a color palette for my website?

Start with your brand or primary color and use a harmony rule to find supporting colors. Typically you need 3-5 colors: a primary, a secondary accent, a background, and a text color. Always check contrast ratios between text and background colors to ensure accessibility.

Can I lock colors and regenerate the rest?

Yes. In the Random Palette tab, click the lock icon on any swatch to keep that color fixed. When you click Generate again, only the unlocked colors will be replaced with new ones following the selected harmony rule.