Palette Generator

Generate harmonious color schemes based on color theory

Base Color

Color Code

Palette Type

Generated Palette

#8B5CF6

RGB: 139, 92, 246

#C8F65A

RGB: 200, 246, 90

Color Theory Tips

• Complementary: High contrast, vibrant look
• Analogous: Harmonious and pleasing to the eye
• Triadic: Balanced and colorful
• Tetradic: Rich with many variations
• Monochromatic: Clean and elegant

How It Works

Color Theory Fundamentals

Palette generation is based on Itten's Color Wheel harmony theory. By selecting colors at specific angular intervals on the hue wheel, visually harmonious color combinations can be produced. This tool converts the base color to HSL space using the colord library, then shifts the hue dimension according to mathematical rules while keeping saturation and lightness unchanged.

Palette Scheme Details

Complementary (180°)

Two colors 180° apart on the hue wheel. High contrast and strong visual impact, ideal for highlighting key elements or creating dramatic effects.

Analogous (±30°)

Three adjacent colors within ±30° on the hue wheel. Visually harmonious and unified, commonly found in nature, evoking warmth and comfort.

Triadic (120°)

Three colors evenly spaced at 120° on the hue wheel. Rich yet balanced, suitable for designs that need vibrancy without losing harmony.

Tetradic (90°)

Four colors at 90° intervals on the hue wheel, forming two complementary pairs. Rich in variation but requires careful attention to color hierarchy.

Monochromatic

Variations in lightness of a single hue, generated via lighten/darken. Clean, elegant, and well-layered.

Usage Guide

Choose a Base Color

Use the color picker or enter a HEX value to set the base color. You can also click the randomize button for inspiration.

Select a Palette Type

Choose a palette scheme type from the left panel. The generated palette updates in real time.

Copy or Export

Click a color swatch to copy its HEX value, use "Copy All" for the entire palette, or "Export PNG" to download a color card image.

Apply to Your Design

Apply the palette to your design projects, or import it into tools like Figma, Sketch, and more.

FAQ

Can I use the generated palettes in commercial projects?

Absolutely. Color palettes themselves are not subject to copyright protection. You are free to use them in any personal or commercial project. The exported color card images can also be used freely.

Why does the complementary scheme only have two colors?

By definition, complementary colors are the two colors directly opposite each other on the hue wheel. If you need more colors, try the tetradic scheme (two complementary pairs) or manually adjust lightness variations on top of the complementary pair.

How can I make my palette more layered?

Try adding lightness variations to each color in the generated palette (similar to the monochromatic lighten/darken approach). A good design typically uses 5–7 colors, including primary, secondary, accent colors, and their light/dark variants.

What is the resolution of the exported PNG?

Each color swatch is 200px wide and 300px tall (200px for the color area and 100px for the HEX label). The total width equals the number of colors × 200px.