← Back to Editor

#B37C8F · #DE8380 · #DBA87B · #A39C80 · #758F84

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 Library

Color Details Color Details

#B37C8F

Dark Violet · DarkGray · Rose Pink

HEX
#B37C8F
RGB
rgb(179, 124, 143)
HSL
hsl(339, 27%, 59%)
HSB
hsb(339, 31%, 70%)
CMYK
cmyk(0%, 31%, 20%, 30%)
Oklch
oklch(64.7% 0.073 356.9)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

#DE8380

Peach Pink · LightCoral · Coral Red

HEX
#DE8380
RGB
rgb(222, 131, 128)
HSL
hsl(2, 59%, 69%)
HSB
hsb(2, 42%, 87%)
CMYK
cmyk(0%, 41%, 42%, 13%)
Oklch
oklch(70.7% 0.113 22.3)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#DBA87B

Apricot · BurlyWood · Warm Sun

HEX
#DBA87B
RGB
rgb(219, 168, 123)
HSL
hsl(28, 57%, 67%)
HSB
hsb(28, 44%, 86%)
CMYK
cmyk(0%, 23%, 44%, 14%)
Oklch
oklch(76.8% 0.085 62.5)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#A39C80

Ginger · DarkSeaGreen · Sunflower

HEX
#A39C80
RGB
rgb(163, 156, 128)
HSL
hsl(48, 16%, 57%)
HSB
hsb(48, 21%, 64%)
CMYK
cmyk(0%, 4%, 21%, 36%)
Oklch
oklch(69.1% 0.040 95.6)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#758F84

Mineral Blue · Gray · Olive Green

HEX
#758F84
RGB
rgb(117, 143, 132)
HSL
hsl(155, 10%, 51%)
HSB
hsb(155, 18%, 56%)
CMYK
cmyk(18%, 0%, 8%, 44%)
Oklch
oklch(62.6% 0.034 167.7)

TraditionalMineral Blue」· PaintOlive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B37C8F
7AB39F

Analogous

B37AAA
B37C8F
B3837A

Triadic

B37C8F
8EB37A
7A8EB3

Split-Comp.

B37C8F
7AB383
7AAAB3

Tetradic

B37C8F
AAB37A
7AB39F
837AB3

Contrast Matrix WCAG 2.1 Contrast

B37C8F
DE8380
DBA87B
A39C80
758F84
1.2
Fail
1.6
Fail
1.2
Fail
1.0
Fail
1.2
Fail
1.3
Fail
1.0
Fail
1.3
Fail
1.6
Fail
1.3
Fail
1.3
Fail
1.6
Fail
1.2
Fail
1.0
Fail
1.3
Fail
1.3
Fail
1.0
Fail
1.3
Fail
1.6
Fail
1.3
Fail
White BG
3.4AA Large
2.7Fail
2.1Fail
2.8Fail
3.5AA Large
Black BG
6.2AA
7.7AAA
9.9AAA
7.6AAA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9B8A
B7B681
C5C486
A0A087
808087

Deuteranopia

9EA389
BCC381
C8CC89
A0A188
7F7D87

Tritanopia

B08786
D98181
D88E90
A38C8D
768989

Achromatopsia

8F8F8F
9E9E9E
B2B2B2
9B9B9B
868686

Shades & Tints Shades & Tints

#B37C8F

Dark
Light

#DE8380

Dark
Light

#DBA87B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b37c8f;
  --color-2: #de8380;
  --color-3: #dba87b;
  --color-4: #a39c80;
  --color-5: #758f84;
}

SCSS

$color-1: #b37c8f;
$color-2: #de8380;
$color-3: #dba87b;
$color-4: #a39c80;
$color-5: #758f84;

TAILWIND

colors: {
  'brand-1': '#b37c8f',
  'brand-2': '#de8380',
  'brand-3': '#dba87b',
  'brand-4': '#a39c80',
  'brand-5': '#758f84',
}

RGB Array

[179, 124, 143], [222, 131, 128], [219, 168, 123], [163, 156, 128], [117, 143, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B37C8F, #DE8380, #DBA87B, #A39C80, #758F84 is ideal for: corporate websites, product showcases, portfolios. 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: #b37c8f; --color-2: #de8380; --color-3: #dba87b; --color-4: #a39c80; --color-5: #758f84. 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. 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