← Back to Editor

#860838 · #B84C27 · #EA9015 · #2A1218 · #AF054F

coffee

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#860838

Dark Violet · Brown · Camellia

HEX
#860838
RGB
rgb(134, 8, 56)
HSL
hsl(337, 89%, 28%)
HSB
hsb(337, 94%, 53%)
CMYK
cmyk(0%, 94%, 58%, 47%)
Oklch
oklch(40.1% 0.155 7.9)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#B84C27

Tangerine · Sienna · Amber Brown

HEX
#B84C27
RGB
rgb(184, 76, 39)
HSL
hsl(15, 65%, 44%)
HSB
hsb(15, 79%, 72%)
CMYK
cmyk(0%, 59%, 79%, 28%)
Oklch
oklch(55.3% 0.149 38.6)

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

#EA9015

Ochre · GoldenRod · Amber Brown

HEX
#EA9015
RGB
rgb(234, 144, 21)
HSL
hsl(35, 84%, 50%)
HSB
hsb(35, 91%, 92%)
CMYK
cmyk(0%, 38%, 91%, 8%)
Oklch
oklch(73.1% 0.159 65.7)

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

#2A1218

Crimson · Black · Deep Berry

HEX
#2A1218
RGB
rgb(42, 18, 24)
HSL
hsl(345, 40%, 12%)
HSB
hsb(345, 57%, 16%)
CMYK
cmyk(0%, 57%, 43%, 84%)
Oklch
oklch(22.0% 0.040 5.0)

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

#AF054F

Dark Violet · Crimson · Camellia

HEX
#AF054F
RGB
rgb(175, 5, 79)
HSL
hsl(334, 94%, 35%)
HSB
hsb(334, 97%, 69%)
CMYK
cmyk(0%, 97%, 55%, 31%)
Oklch
oklch(48.6% 0.193 5.7)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

860838
088756

Analogous

870878
860838
871708

Triadic

860838
398708
083987

Split-Comp.

860838
088717
087887

Tetradic

860838
788708
088756
170887

Contrast Matrix WCAG 2.1 Contrast

860838
B84C27
EA9015
2A1218
AF054F
—
1.9
Fail
4.0
AA Large
1.8
Fail
1.4
Fail
1.9
Fail
—
2.1
Fail
3.4
AA Large
1.4
Fail
4.0
AA Large
2.1
Fail
—
7.1
AAA
2.9
Fail
1.8
Fail
3.4
AA Large
7.1
AAA
—
2.5
Fail
1.4
Fail
1.4
Fail
2.9
Fail
2.5
Fail
—
White BG
10.0AAA
5.1AA
2.5Fail
17.5AAA
7.1AAA
Black BG
2.1Fail
4.1AA Large
8.5AAA
1.2Fail
3.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F4E2C
898830
C3C233
201F17
65643D

Deuteranopia

57602A
909832
C8CF3A
212316
6F7C39

Tritanopia

802321
B33739
E54A4F
291515
A72F2C

Achromatopsia

333333
686868
9D9D9D
1A1A1A
404040

Shades & Tints Shades & Tints

#860838

Dark
Light

#B84C27

Dark
Light

#EA9015

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #860838;
  --color-2: #b84c27;
  --color-3: #ea9015;
  --color-4: #2a1218;
  --color-5: #af054f;
}

SCSS

$color-1: #860838;
$color-2: #b84c27;
$color-3: #ea9015;
$color-4: #2a1218;
$color-5: #af054f;

TAILWIND

colors: {
  'brand-1': '#860838',
  'brand-2': '#b84c27',
  'brand-3': '#ea9015',
  'brand-4': '#2a1218',
  'brand-5': '#af054f',
}

RGB Array

[134, 8, 56], [184, 76, 39], [234, 144, 21], [42, 18, 24], [175, 5, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This coffee-style palette of #860838, #B84C27, #EA9015, #2A1218, #AF054F is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #860838; --color-2: #b84c27; --color-3: #ea9015; --color-4: #2a1218; --color-5: #af054f. 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. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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