Color Palette Generator
Generate a 5-color palette from a base hex color using complementary, analogous, or triadic color theory.
About this tool
Enter a base hex color and generate a coordinated 5-color palette using one of three classic color-theory relationships: complementary (lightness variations around your base plus its opposite on the color wheel, for high-contrast accents), analogous (neighboring hues 15-30 degrees apart, for a harmonious, low-contrast palette), or triadic (three hues evenly spaced 120 degrees apart, for a balanced but vibrant combination). Each swatch shows its hex value with its own copy button, and a "Randomize base color" button lets you explore palettes starting from a color you didn’t have to pick yourself. The color math converts your hex input to HSL internally to compute hue rotations and lightness variations, then converts back to hex for display - the same underlying approach a designer would use manually with a color wheel, just automated. Runs entirely client-side.
Frequently asked questions
Complementary pairs a color with its direct opposite on the color wheel (180 degrees away), producing high contrast that works well for accents and calls-to-action. Analogous uses hues that sit close together (within about 30 degrees), producing a calm, cohesive palette since the colors are naturally similar. Triadic picks three hues spaced evenly 120 degrees apart, giving a palette that’s vibrant and varied while still feeling balanced, since no single hue dominates.
Hex (and the RGB it represents) encodes color as red/green/blue channel mixtures, which makes "rotate the hue by 120 degrees" or "make this lighter" mathematically awkward to compute directly. HSL separates hue, saturation, and lightness into independent values, so rotating hue for a triadic palette or adjusting lightness for a tint is a simple addition or subtraction - the same reason designers think in terms of a color wheel rather than RGB percentages.
Color theory relationships (complementary, analogous, triadic) are a reliable starting point that professional designers actually use, but "reliable starting point" isn’t the same as "guaranteed perfect for your specific use case" - the right palette also depends on context like background color, accessibility contrast requirements, and brand tone that this tool doesn’t know about. Treat the output as a solid draft to refine, not a final, unreviewed answer.
Explore more free tools
Formatters, converters, validators, and generators - all free and running entirely in your browser.
Browse more tools