Color Palette Generator

How to use this color palette generator

1. Type or pick a base color.
2. Choose a color harmony scheme.
3. Click any swatch to copy its hex code.

What do these color schemes mean?

Complementary uses opposite hues for strong contrast. Analogous uses neighboring hues for a harmonious feel. Triadic uses three evenly-spaced hues for vibrant balance. Monochromatic varies only lightness for a subtle, cohesive palette.

Why these schemes are computed on the color wheel, not chosen by eye

Each scheme this tool generates is really just a rotation around the hue wheel, computed in HSL color space where hue is a value from 0 to 360 degrees. Complementary takes the base hue and adds exactly 180 degrees, landing on the mathematically opposite point on the wheel. Triadic splits the wheel into three equal segments, adding 120 and 240 degrees. Analogous stays close, typically offsetting by around 30 degrees in each direction. Monochromatic doesn't touch hue at all — it holds hue and often saturation fixed while varying only lightness, producing tints and shades of the same color rather than different hues entirely. None of this involves aesthetic judgment; it's pure geometry on the hue wheel, which is exactly why these classical schemes are reliable starting points rather than guaranteed good design.

Why hue harmony alone doesn't guarantee a good palette

Getting the hue relationship mathematically correct — a true 180-degree complementary pair, for instance — doesn't automatically produce colors that work well together, because saturation and lightness matter just as much as hue for how a pairing actually reads. Two colors at perfectly complementary hues can still clash uncomfortably if one is highly saturated and the other muted, or if their lightness values are too close together to create visual separation. This is why professional palette work usually treats a hue-wheel scheme as a starting skeleton — the correct hue relationships — that still needs saturation and lightness adjusted deliberately for the specific application, rather than a finished palette to use exactly as generated.

The limits of hue-wheel color theory in HSL specifically

Classical color harmony rules (complementary, triadic, analogous) predate digital color entirely — they come from pigment and print theory, and HSL was designed as a simple, intuitive model for humans to reason about color, not as a model that matches human color perception precisely. HSL's hue wheel isn't perceptually uniform: two hues 180 degrees apart in HSL don't always look like equally strong "opposites" to the human eye the way true perceptual complements would, because human color perception doesn't distribute evenly across the HSL hue values the way the math assumes. Newer perceptually-uniform color spaces (like LCH or OKLCH) address this more precisely, which is worth knowing if a generated "complementary" pair doesn't look as balanced as the math suggests it should.

Harmony and accessibility are separate concerns

A palette that satisfies classical color harmony rules can still fail basic accessibility requirements if used carelessly — hue harmony says nothing about contrast ratio, which is what actually determines whether text is legible against a background for readers with low vision or color blindness. Two colors that form a textbook-perfect complementary pair can still have almost no contrast in lightness, making one nearly invisible against the other for text purposes, even though they're harmonious by hue. Any color pairing intended for text-on-background use needs a separate contrast ratio check (WCAG defines specific minimum ratios) regardless of how well it scores on hue harmony alone.

Limitations of this tool

This generator computes color relationships purely through HSL hue rotation and lightness variation — it doesn't check contrast ratios or accessibility compliance for any pairing, doesn't account for the perceptual non-uniformity of HSL described above, and doesn't suggest which color should serve which role (primary, accent, background, text) in an actual design, since that depends on context this tool has no way to know. Treat the output as a mathematically correct starting palette to refine by eye and verify for accessibility, not a finished, ready-to-use design system.