Complementary
Two hues opposite each other. High contrast — use one as the dominant color and the other as an accent.
Interactive color wheel with a lightness ring, locked harmony chords, and copy-ready palettes — complementary, analogous, triadic, tetradic, square, and more.
Inner disc: hue + saturation. Outer ring: lightness. Handles stay locked as a analogous chord.
#E21DAA
-30°
#E21D48
Base
#E2551D
+30°
Analogous · Neighbors of the base hue
rgb(225, 29, 72)Tints
Add white
Shades
Add black
Tones
Add gray
Color theory
Hue runs around the circle, saturation falls toward the center, and the outer ring lightens or darkens the chord. Pick a harmony, then fine-tune tints, shades, and tones.
Two hues opposite each other. High contrast — use one as the dominant color and the other as an accent.
Neighbors on the wheel. Soft, cohesive palettes that show up often in product UI and brand systems.
Three hues 120° apart. Bright and balanced when one color leads and the others support.
Base plus the two hues beside its complement. Easier to live with than a raw complementary pair.
Four hues: tetradic is two complementary pairs; square is even 90° steps. Best as a starting palette.
White, black, and gray variants of the base. Use them for surfaces, type, hover states, and depth.
12 hues on this RGB wheel
Keep exploring
Generate palettes like Coolors: full-screen colors, add or delete swatches, lock, download, and share a hex URL.
Open toolFlagship color picker with EyeDropper, HSV/RGB/HSL controls, harmonies, tints & shades, WCAG contrast, favorites, and copy-ready CSS.
Open toolFind accessible text and background color pairings for headings and body copy.
Open toolClick a question to open it. Click again to close.
Looking for more? Browse Our Tools.