← Back to Editor

#E4CDAF · #6F614F · #C0A581 · #85165D · #5E795F

coffee

A 5-color coffee palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E4CDAF

Goose Yellow · Wheat · Peach Orange

HEX
#E4CDAF
RGB
rgb(228, 205, 175)
HSL
hsl(34, 50%, 79%)
HSB
hsb(34, 23%, 89%)
CMYK
cmyk(0%, 10%, 23%, 11%)
Oklch
oklch(86.0% 0.048 74.4)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#6F614F

Ochre · DimGray · Amber Brown

HEX
#6F614F
RGB
rgb(111, 97, 79)
HSL
hsl(34, 17%, 37%)
HSB
hsb(34, 29%, 44%)
CMYK
cmyk(0%, 13%, 29%, 56%)
Oklch
oklch(50.1% 0.033 73.9)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#C0A581

Ginger · Tan · Warm Sun

HEX
#C0A581
RGB
rgb(192, 165, 129)
HSL
hsl(34, 33%, 63%)
HSB
hsb(34, 33%, 75%)
CMYK
cmyk(0%, 14%, 33%, 25%)
Oklch
oklch(73.7% 0.058 74.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#85165D

Rose Purple · Purple · Camellia

HEX
#85165D
RGB
rgb(133, 22, 93)
HSL
hsl(322, 72%, 30%)
HSB
hsb(322, 83%, 52%)
CMYK
cmyk(0%, 83%, 30%, 48%)
Oklch
oklch(42.0% 0.159 347.3)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#5E795F

Celadon · DimGray · Olive Green

HEX
#5E795F
RGB
rgb(94, 121, 95)
HSL
hsl(122, 13%, 42%)
HSB
hsb(122, 22%, 47%)
CMYK
cmyk(22%, 0%, 21%, 53%)
Oklch
oklch(54.7% 0.051 145.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E4CDAF
AFC6E4

Analogous

E4B2AF
E4CDAF
E1E4AF

Triadic

E4CDAF
AFE4CD
CDAFE4

Split-Comp.

E4CDAF
AFE1E4
B2AFE4

Tetradic

E4CDAF
AFE4B2
AFC6E4
E4AFE1

Contrast Matrix WCAG 2.1 Contrast

E4CDAF
6F614F
C0A581
85165D
5E795F
—
3.9
AA Large
1.5
Fail
6.0
AA
3.1
AA Large
3.9
AA Large
—
2.6
Fail
1.5
Fail
1.3
Fail
1.5
Fail
2.6
Fail
—
3.9
AA Large
2.0
Fail
6.0
AA
1.5
Fail
3.9
AA Large
—
1.9
Fail
3.1
AA Large
1.3
Fail
2.0
Fail
1.9
Fail
—
White BG
1.5Fail
6.0AA
2.3Fail
9.3AAA
4.8AA
Black BG
13.7AAA
3.5AA Large
8.9AAA
2.3Fail
4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADAB6
696953
B4B48A
55544C
6A6A65

Deuteranopia

DBDDB8
6A6B54
B6B88C
5B6448
686667

Tritanopia

E3BCBD
6E5758
BF9192
7F3E3B
5F6A6B

Achromatopsia

D0D0D0
636363
A9A9A9
3F3F3F
6E6E6E

Shades & Tints Shades & Tints

#E4CDAF

Dark
Light

#6F614F

Dark
Light

#C0A581

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e4cdaf;
  --color-2: #6f614f;
  --color-3: #c0a581;
  --color-4: #85165d;
  --color-5: #5e795f;
}

SCSS

$color-1: #e4cdaf;
$color-2: #6f614f;
$color-3: #c0a581;
$color-4: #85165d;
$color-5: #5e795f;

TAILWIND

colors: {
  'brand-1': '#e4cdaf',
  'brand-2': '#6f614f',
  'brand-3': '#c0a581',
  'brand-4': '#85165d',
  'brand-5': '#5e795f',
}

RGB Array

[228, 205, 175], [111, 97, 79], [192, 165, 129], [133, 22, 93], [94, 121, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This coffee-style palette of #E4CDAF, #6F614F, #C0A581, #85165D, #5E795F is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e4cdaf; --color-2: #6f614f; --color-3: #c0a581; --color-4: #85165d; --color-5: #5e795f. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This coffee-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color