🌈 Analogous Color Scheme Generator
Enter a base color and get its analogous scheme, neighbouring hues about 30° apart, for a calm, cohesive palette.
Analogous
Exact hue rotations on the color wheel, with HEX, HSL and OKLCH codes. 🔒 Computed in your browser.
How the analogous color scheme generator works
An analogous scheme uses hues adjacent on the wheel, typically base−30°, base, base+30° (and optionally ±60°), at the same saturation and lightness. Concretely, only the hue angle H changes: a base of hsl(210, 80%, 50%) yields partners at hue 180° and 240°, while S and L stay fixed, so the three colors share the same vividness and brightness and differ only in hue. Because hue is circular, the tool wraps angles past 360° back into 0-360° (base 350° + 30° = 20°). It computes the neighbours exactly and shows them with HEX, HSL and OKLCH.
Analogous colors sit next to each other on the wheel, so they blend naturally, the look of a sunset or a forest. Pick one as the dominant color and use the neighbours for support.
Frequently asked questions
What is an analogous color scheme?
A set of colors next to each other on the wheel, usually about 30° apart. Because the hues are close, the palette feels calm and cohesive, common in nature scenes.
How do I create an analogous palette?
Take your base hue and step ±30° (and optionally ±60°). Enter a color and the tool returns the neighbouring hues in HEX, HSL and OKLCH.
How is analogous different from triadic?
Analogous hues are close together for a unified, low-contrast look; triadic hues are 120° apart for a vivid, high-contrast balance.
How many analogous colors should I use?
Three to five works well: one dominant, the rest as support. Vary lightness (see the OKLCH values) to add depth without breaking the harmony.
Worked example: what are the analogous hues of a hue-210 blue?
Stepping ±30° gives hue 180° (cyan) and hue 240° (indigo), keeping the same saturation and lightness. Widening to ±60° adds hue 150° and 270° for a five-color set. The base stays the visual anchor.
Should I space by 30° or something else?
Thirty degrees is the common default, but any small, equal step works, 20° gives a tighter, more monochromatic feel; 45° pushes toward contrast. Keeping the step equal on both sides is what preserves the balanced, harmonious look.
Is my color uploaded?
No, the computation runs in your browser.