#D4CDDEFog
#8E7F89Gray
#645153Umber
#281913Raisin

Espresso Raisin & Umber color palette

Open in generator
Ask AI about this palette: ChatGPTClaudePerplexity

Espresso Raisin & Umber is a muted split color palette tagged dark, monochrome, minimal. A split scheme: Fog plays against Raisin across roughly 112° of hue. Saturation stays low across the board, giving it a calm, editorial feel. Warm and cool hues are mixed, which adds depth.

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Fog#D4CDDErgb(212, 205, 222)hsl(265, 20%, 84%)oklch(85.9% 0.024 304)
Gray#8E7F89rgb(142, 127, 137)hsl(320, 6%, 53%)oklch(61.3% 0.023 338)
Umber#645153rgb(100, 81, 83)hsl(354, 10%, 35%)oklch(45.5% 0.026 11)
Raisin#281913rgb(40, 25, 19)hsl(17, 36%, 12%)oklch(23.1% 0.027 43)

Why it works and how to use it

Two of the four colors are near-neutral, which leaves room for Umber to lead. Lightness runs from 12% to 84%. Well suited to websites, presentations and branding.

  • Background: Fog (#D4CDDE) is the lightest color, so it belongs on large surfaces.
  • Text: Raisin (#281913) on #D4CDDE gives 10.97:1, passing WCAG AAA.
  • Primary: Umber (#645153) is the most saturated mid-tone; use it for buttons and links (4.78:1 against the background, fine for UI elements).
  • Accent: Gray (#8E7F89) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Fog on Raisin at 10.97:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Espresso Raisin & Umber

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#D4CDDE
#8E7F89
#645153
#281913

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#D4CDDE on #281913Aa10.97:1AAA
#D4CDDE on #645153Aa4.78:1AA
#8E7F89 on #281913Aa4.48:1AA large only
#D4CDDE on #8E7F89Aa2.45:1Fail
#645153 on #281913Aa2.3:1Fail
#8E7F89 on #645153Aa1.95:1Fail

Similar palettes 24 more in this mood