← Back to Editor

#729E90 · #F7B76B · #E6744D · #BA2F30 · #4F1011

coffee

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#729E90

Mineral Blue · LightSlateGray · Lake Green

HEX
#729E90
RGB
rgb(114, 158, 144)
HSL
hsl(161, 18%, 53%)
HSB
hsb(161, 28%, 62%)
CMYK
cmyk(28%, 0%, 9%, 38%)
Oklch
oklch(66.3% 0.052 173.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#F7B76B

Ginger · SandyBrown · Warm Sun

HEX
#F7B76B
RGB
rgb(247, 183, 107)
HSL
hsl(33, 90%, 69%)
HSB
hsb(33, 57%, 97%)
CMYK
cmyk(0%, 26%, 57%, 3%)
Oklch
oklch(82.3% 0.119 69.6)

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

#E6744D

Tangerine · Coral · Warm Sun

HEX
#E6744D
RGB
rgb(230, 116, 77)
HSL
hsl(15, 75%, 60%)
HSB
hsb(15, 67%, 90%)
CMYK
cmyk(0%, 50%, 67%, 10%)
Oklch
oklch(68.4% 0.152 39.3)

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

#BA2F30

Crimson · FireBrick · Passion Red

HEX
#BA2F30
RGB
rgb(186, 47, 48)
HSL
hsl(360, 60%, 46%)
HSB
hsb(360, 75%, 73%)
CMYK
cmyk(0%, 75%, 74%, 27%)
Oklch
oklch(52.4% 0.176 25.4)

Traditional「Crimson」· Paint「Passion Red」· Creative Deep Ember

#4F1011

Vermilion · Maroon · Deep Berry

HEX
#4F1011
RGB
rgb(79, 16, 17)
HSL
hsl(359, 66%, 19%)
HSB
hsb(359, 80%, 31%)
CMYK
cmyk(0%, 80%, 78%, 69%)
Oklch
oklch(28.6% 0.093 24.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

729E90
9D727F

Analogous

729D79
729E90
72959D

Triadic

729E90
8F729D
9D8F72

Split-Comp.

729E90
9D7295
9D7972

Tetradic

729E90
79729D
9D727F
959D72

Contrast Matrix WCAG 2.1 Contrast

729E90
F7B76B
E6744D
BA2F30
4F1011
—
1.7
Fail
1.0
Fail
2.0
Fail
5.0
AA
1.7
Fail
—
1.7
Fail
3.4
AA Large
8.4
AAA
1.0
Fail
1.7
Fail
—
2.0
Fail
4.9
AA
2.0
Fail
3.4
AA Large
2.0
Fail
—
2.5
Fail
5.0
AA
8.4
AAA
4.9
AA
2.5
Fail
—
White BG
3.0Fail
1.8Fail
3.0AA Large
5.9AA
14.8AAA
Black BG
7.0AAA
11.9AAA
7.0AA
3.5AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

858593
DBDB7D
B5B456
7E7D30
343311

Deuteranopia

837F94
DFE482
BBC459
869030
373C11

Tritanopia

749697
F48C8F
E05E60
B33030
4C1111

Achromatopsia

8F8F8F
C1C1C1
929292
595959
232323

Shades & Tints Shades & Tints

#729E90

Dark
Light

#F7B76B

Dark
Light

#E6744D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #729e90;
  --color-2: #f7b76b;
  --color-3: #e6744d;
  --color-4: #ba2f30;
  --color-5: #4f1011;
}

SCSS

$color-1: #729e90;
$color-2: #f7b76b;
$color-3: #e6744d;
$color-4: #ba2f30;
$color-5: #4f1011;

TAILWIND

colors: {
  'brand-1': '#729e90',
  'brand-2': '#f7b76b',
  'brand-3': '#e6744d',
  'brand-4': '#ba2f30',
  'brand-5': '#4f1011',
}

RGB Array

[114, 158, 144], [247, 183, 107], [230, 116, 77], [186, 47, 48], [79, 16, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This coffee-style palette of #729E90, #F7B76B, #E6744D, #BA2F30, #4F1011 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #729e90; --color-2: #f7b76b; --color-3: #e6744d; --color-4: #ba2f30; --color-5: #4f1011. 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 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