Color Harmony
Reliable ways to combine colors that work together.
Color harmony rules use positions on the color wheel to find colors that work together. Start with the overview of all seven, then go deeper into each scheme: how it's formed, how to balance it, and example palettes with contrast checks for text.
Guides
- Color HarmonyUnderstanding Color Harmony: 7 Ways to Combine ColorsSeven dependable color harmony rules, from monochromatic to double complementary, with a wheel diagram and an example palette for each.3 min readBeginnerRead the full guide
- Color HarmonyComplementary Colors: How to Use Opposites Without ClashingWhat complementary colors are, common pairs with HEX codes, and how to balance them with one dominant color, muted versions and the 60-30-10 split.6 min readBeginnerRead the full guide
- Color HarmonyAnalogous Colors: How to Build Calm, Cohesive PalettesWhat analogous colors are, how wide the hue range should be, how to pick a lead color and add contrast, with warm, cool and nature palettes in HEX.6 min readBeginnerRead the full guide
- Color HarmonyMonochromatic Color Palettes: How to Design with One HueHow to build a monochromatic palette from one hue with tints, shades and tones, keep it from feeling flat, and use it for UI, branding and interiors.6 min readBeginnerRead the full guide
- Color HarmonySplit Complementary Colors: A Softer Way to Use ContrastHow a split complementary scheme is formed on the color wheel, why it's easier to balance than complementary, and how to assign the base and split colors.6 min readBeginnerRead the full guide
- Color HarmonyTriadic Colors: How to Balance Three Bold HuesHow to pick three evenly spaced triadic colors and keep them balanced, with palettes for playful brands, illustration and dashboards and text contrast for each.5 min readIntermediateRead the full guide
- Color HarmonyTetradic Color Schemes: Square and Rectangle PalettesSquare and rectangle (double complementary) tetradic color schemes explained, how to tame four hues with one leader, and example palettes with HEX values.6 min readIntermediateRead the full guide