← Back to Editor

#B89C77 · #748D89 · #381809 · #E24729 · #C9A072

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#B89C77

Ginger · Tan · Warm Sun

HEX
#B89C77
RGB
rgb(184, 156, 119)
HSL
hsl(34, 31%, 59%)
HSB
hsb(34, 35%, 72%)
CMYK
cmyk(0%, 15%, 35%, 28%)
Oklch
oklch(70.9% 0.061 74.3)

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

#748D89

Mineral Blue · SlateGray · Mint Ice

HEX
#748D89
RGB
rgb(116, 141, 137)
HSL
hsl(170, 10%, 50%)
HSB
hsb(170, 18%, 55%)
CMYK
cmyk(18%, 0%, 3%, 45%)
Oklch
oklch(62.3% 0.029 184.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#381809

Tangerine · Black · Cinnamon

HEX
#381809
RGB
rgb(56, 24, 9)
HSL
hsl(19, 72%, 13%)
HSB
hsb(19, 84%, 22%)
CMYK
cmyk(0%, 57%, 84%, 78%)
Oklch
oklch(25.3% 0.057 44.3)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#E24729

Vermilion · Chocolate · Passion Red

HEX
#E24729
RGB
rgb(226, 71, 41)
HSL
hsl(10, 76%, 52%)
HSB
hsb(10, 82%, 89%)
CMYK
cmyk(0%, 69%, 82%, 11%)
Oklch
oklch(61.5% 0.197 33.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#C9A072

Ginger · Tan · Warm Sun

HEX
#C9A072
RGB
rgb(201, 160, 114)
HSL
hsl(32, 45%, 62%)
HSB
hsb(32, 43%, 79%)
CMYK
cmyk(0%, 20%, 43%, 21%)
Oklch
oklch(73.3% 0.078 69.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B89C77
7692B7

Analogous

B77A76
B89C77
B3B776

Triadic

B89C77
76B79B
9B76B7

Split-Comp.

B89C77
76B3B7
7A76B7

Tetradic

B89C77
76B77A
7692B7
B776B3

Contrast Matrix WCAG 2.1 Contrast

B89C77
748D89
381809
E24729
C9A072
—
1.4
Fail
6.2
AA
1.6
Fail
1.1
Fail
1.4
Fail
—
4.5
AA
1.1
Fail
1.5
Fail
6.2
AA
4.5
AA
—
4.0
AA Large
6.7
AA
1.6
Fail
1.1
Fail
4.0
AA Large
—
1.7
Fail
1.1
Fail
1.5
Fail
6.7
AA
1.7
Fail
—
White BG
2.6Fail
3.6AA Large
16.1AAA
4.1AA Large
2.4Fail
Black BG
8.1AAA
5.9AA
1.3Fail
5.2AA
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAC80
7F7F8A
2A2A0D
9F9D30
B7B77D

Deuteranopia

AEB082
7D7B8A
2C2E0E
A8B432
BABD80

Tritanopia

B78789
758B8B
360F10
DA3637
C78688

Achromatopsia

A0A0A0
858585
202020
727272
A7A7A7

Shades & Tints Shades & Tints

#B89C77

Dark
Light

#748D89

Dark
Light

#381809

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b89c77;
  --color-2: #748d89;
  --color-3: #381809;
  --color-4: #e24729;
  --color-5: #c9a072;
}

SCSS

$color-1: #b89c77;
$color-2: #748d89;
$color-3: #381809;
$color-4: #e24729;
$color-5: #c9a072;

TAILWIND

colors: {
  'brand-1': '#b89c77',
  'brand-2': '#748d89',
  'brand-3': '#381809',
  'brand-4': '#e24729',
  'brand-5': '#c9a072',
}

RGB Array

[184, 156, 119], [116, 141, 137], [56, 24, 9], [226, 71, 41], [201, 160, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B89C77, #748D89, #381809, #E24729, #C9A072 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: #b89c77; --color-2: #748d89; --color-3: #381809; --color-4: #e24729; --color-5: #c9a072. 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 general-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