Which harmony type should I use for a website?

Analogous schemes feel natural and calm — great for most websites. Complementary schemes create bold contrast, ideal for call-to-action buttons. Monochromatic schemes feel elegant and minimal.

Why do some colors look different on screen vs print?

Screens use RGB (additive color), while print uses CMYK (subtractive color). Colors that look vibrant on screen may appear duller in print. Use a professional color management tool for print work.

Is my data uploaded to a server?

No. Everything runs locally in your browser using JavaScript. Your data never leaves your device.

What is the difference between triadic and tetradic?

Triadic uses 3 colors evenly spaced at 120° apart. Tetradic (square) uses 4 colors evenly spaced at 90° apart, giving a richer but more complex palette that is harder to balance.

🌈

Color Scheme Generator

Create complementary, triadic, analogous, split-complementary and tetradic color schemes from any base color. Copy HEX codes instantly. Free.

🎨 Design & Color Tools Free Browser-based

Tool

Base color

HEX value

Click any swatch to copy its HEX

Color Harmony Types

Type	Hue Angles	Best For
Complementary	0°, 180°	High contrast, bold designs
Triadic	0°, 120°, 240°	Vibrant, balanced palettes
Analogous	0°, ±30°, ±60°	Natural, harmonious looks
Split-Complementary	0°, 150°, 210°	High contrast, less tension
Tetradic	0°, 90°, 180°, 270°	Rich, complex palettes
Monochromatic	0° (varied S/L)	Subtle, elegant designs

How Color Harmony Works

Color harmonies are based on the positions of colors on the color wheel. Colors calculated using HSL (hue, saturation, lightness) — the hue is rotated by specific angles to produce harmonious combinations that are pleasing to the human eye.

Color Scheme Generator

Color Harmony Types

How Color Harmony Works

Frequently Asked Questions