← Back to Editor

#E38847 · #5B876D · #B54825 · #952827 · #4A1A0F

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

#E38847

Tangerine · Coral · Warm Sun

HEX
#E38847
RGB
rgb(227, 136, 71)
HSL
hsl(25, 74%, 58%)
HSB
hsb(25, 69%, 89%)
CMYK
cmyk(0%, 40%, 69%, 11%)
Oklch
oklch(71.2% 0.137 53.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#5B876D

Celadon · DimGray · Olive Green

HEX
#5B876D
RGB
rgb(91, 135, 109)
HSL
hsl(145, 19%, 44%)
HSB
hsb(145, 33%, 53%)
CMYK
cmyk(33%, 0%, 19%, 47%)
Oklch
oklch(58.4% 0.063 157.8)

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

#B54825

Tangerine · Sienna · Amber Brown

HEX
#B54825
RGB
rgb(181, 72, 37)
HSL
hsl(15, 66%, 43%)
HSB
hsb(15, 80%, 71%)
CMYK
cmyk(0%, 60%, 80%, 29%)
Oklch
oklch(54.3% 0.150 37.7)

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

#952827

Crimson · Brown · Wine Red

HEX
#952827
RGB
rgb(149, 40, 39)
HSL
hsl(1, 59%, 37%)
HSB
hsb(1, 74%, 58%)
CMYK
cmyk(0%, 73%, 74%, 42%)
Oklch
oklch(44.9% 0.145 25.6)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#4A1A0F

Vermilion · Maroon · Deep Berry

HEX
#4A1A0F
RGB
rgb(74, 26, 15)
HSL
hsl(11, 66%, 17%)
HSB
hsb(11, 80%, 29%)
CMYK
cmyk(0%, 65%, 80%, 71%)
Oklch
oklch(29.0% 0.076 34.3)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E38847
45A1E3

Analogous

E34552
E38847
E3D645

Triadic

E38847
45E387
8745E3

Split-Comp.

E38847
45E3D6
4552E3

Tetradic

E38847
52E345
45A1E3
D645E3

Contrast Matrix WCAG 2.1 Contrast

E38847
5B876D
B54825
952827
4A1A0F
—
1.5
Fail
2.0
Fail
3.0
AA Large
5.4
AA
1.5
Fail
—
1.3
Fail
2.0
Fail
3.5
AA Large
2.0
Fail
1.3
Fail
—
1.5
Fail
2.7
Fail
3.0
AA Large
2.0
Fail
1.5
Fail
—
1.8
Fail
5.4
AA
3.5
AA Large
2.7
Fail
1.8
Fail
—
White BG
2.7Fail
4.1AA Large
5.4AA
8.0AAA
14.5AAA
Black BG
7.9AAA
5.1AA
3.9AA Large
2.6Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBB57
6E6E73
86852D
666527
353512

Deuteranopia

C1C85B
6C6875
8C9430
6C7427
383C12

Tritanopia

DE6366
5D7879
B03436
902727
481414

Achromatopsia

9C9C9C
777777
656565
484848
272727

Shades & Tints Shades & Tints

#E38847

Dark
Light

#5B876D

Dark
Light

#B54825

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e38847;
  --color-2: #5b876d;
  --color-3: #b54825;
  --color-4: #952827;
  --color-5: #4a1a0f;
}

SCSS

$color-1: #e38847;
$color-2: #5b876d;
$color-3: #b54825;
$color-4: #952827;
$color-5: #4a1a0f;

TAILWIND

colors: {
  'brand-1': '#e38847',
  'brand-2': '#5b876d',
  'brand-3': '#b54825',
  'brand-4': '#952827',
  'brand-5': '#4a1a0f',
}

RGB Array

[227, 136, 71], [91, 135, 109], [181, 72, 37], [149, 40, 39], [74, 26, 15]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This coffee-style palette of #E38847, #5B876D, #B54825, #952827, #4A1A0F is ideal for: tech websites, dark mode UIs, game UIs, 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: #e38847; --color-2: #5b876d; --color-3: #b54825; --color-4: #952827; --color-5: #4a1a0f. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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