Mocha
#8B5E3C · rgb(139, 94, 60) · hsl(26, 40%, 39%)
Complementary colors
#8b5e3c · #3c698bAnalogous colors
#8b3c41 · #8b5e3c · #8b863cTriadic colors
#8b5e3c · #3c8b5e · #5e3c8bSplit-complementary colors
#8b5e3c · #3c8b86 · #3c418bTetradic colors
#8b5e3c · #418b3c · #3c698b · #863c8bMonochromatic colors
#362417 · #724d31 · #b3794d · #cea98d · #e8d7c9Ready-made palettes with Mocha
Complementary palette
The base color paired with its opposite on the wheel for maximum contrast, plus two neutrals and a soft tint.
#8B5E3C · #3c698b · #bfa088 · #f4f4f5 · #18181b
Analogous palette
Neighboring hues on the color wheel create a calm, cohesive scheme with a light tint and a deep shade.
#8b3c41 · #8B5E3C · #8b863c · #bfa088 · #322215
Triadic palette
Three hues spaced evenly around the wheel for a bold, balanced palette anchored by two neutrals.
#8B5E3C · #3c8b5e · #5e3c8b · #f4f4f5 · #18181b
Monochromatic palette
A single hue stepped from light to dark for a clean, elegant and foolproof palette.
#f9f4f1 · #d7b9a2 · #b47b50 · #68462c · #150e09
If you are wondering what colors go with Mocha, start with its opposite on the wheel — a complementary #3c698b — then soften the pairing with the analogous, triadic and monochromatic schemes above.
Frequently asked questions
Mocha's complementary color is #3c698b. Analogous neighbors, triadic accents and monochromatic tints of the same hue all pair naturally with it too.
Must-know facts
- Every swatch row is a complete scheme you can copy straight into CSS.
- The color wheel can regenerate these harmonies for any base you like.
Related tools
These color tools pair naturally with the one you just used — keep exploring.