Color pairings
Complementary
The color directly opposite on the color wheel — bold contrast, great for accents and call-to-action elements.
Analogous
Colors sitting next to yours on the color wheel — harmonious and cohesive, ideal for backgrounds and multi-tone palettes.
Square
Four colors evenly spaced 90° apart around the wheel — vibrant and varied, good for bold multi-color designs.
Shades
A tonal scale of your chosen color from light to dark — useful for backgrounds, hover states, and layered UI.