CSS Variables:
Click Generate or pick base color + harmony rule. 5-color palette appears. Lock favorites, regenerate rest.
Finding harmonious colors is hard. Color theory generates instant palettes, saving hours of trial and error.
Complementary, analogous, triadic, split-complementary, monochromatic.
Yes, fix favorites while regenerating others.
Click color to copy HEX code.
Harmonious visually; check color contrast separately for accessibility.
Good color palettes are built on relationships. Complementary colors sit opposite on the color wheel (blue + orange, red + green) — high contrast, energetic, attention-grabbing. Analogous colors sit next to each other (blue + blue-green + green) — harmonious, calm, natural. Triadic uses three evenly-spaced colors — vibrant, balanced, playful. Monochromatic uses one hue with different shades — sophisticated, cohesive, modern. Split-complementary uses a color plus the two adjacent to its complement — high contrast but less aggressive than full complementary.
A timeless design rule: 60% dominant color (background, large areas), 30% secondary color (supporting elements, sections), 10% accent color (calls to action, highlights). This applies to websites, presentations, interior design, even wardrobe. The dominant color creates the mood, the secondary adds depth, and the accent draws attention to what matters most. Use this rule with any palette generator to build balanced designs.
Aim for WCAG AA contrast (4.5:1 for body text, 3:1 for large text) or AAA (7:1 for body text) for accessibility. About 8% of men and 0.5% of women have red-green color blindness — don't rely solely on color to convey information. Always pair color with another signal (icon, label, position). For dark mode, use lighter backgrounds (not pure black) and slightly desaturated colors to reduce eye strain.
Generate beautiful, harmonious colour palettes with the Toolzie Color Palette Generator. Create complementary, analogous, triadic, and monochromatic palettes from any base colour — ideal for web design, branding, and art projects.
Complementary colours sit opposite each other on the colour wheel, creating high contrast and vibrant combinations.
Analogous palettes use colours that sit adjacent on the colour wheel — they feel harmonious and natural.
Yes — copy individual HEX codes or download the palette image for use in design tools.
Each palette typically generates 5 colours, but you can regenerate for variations.