← Back to Editor

#D6B75A · #BDAA71 · #96A178 · #948E78 · #856565

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D6B75A

Ginger · SandyBrown · Sunflower

HEX
#D6B75A
RGB
rgb(214, 183, 90)
HSL
hsl(45, 60%, 60%)
HSB
hsb(45, 58%, 84%)
CMYK
cmyk(0%, 14%, 58%, 16%)
Oklch
oklch(78.8% 0.118 91.1)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#BDAA71

Ginger · Tan · Sunflower

HEX
#BDAA71
RGB
rgb(189, 170, 113)
HSL
hsl(45, 37%, 59%)
HSB
hsb(45, 40%, 74%)
CMYK
cmyk(0%, 10%, 40%, 26%)
Oklch
oklch(74.1% 0.078 91.7)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#96A178

Grass Green · DarkSeaGreen · Olive Green

HEX
#96A178
RGB
rgb(150, 161, 120)
HSL
hsl(76, 18%, 55%)
HSB
hsb(76, 25%, 63%)
CMYK
cmyk(7%, 0%, 25%, 37%)
Oklch
oklch(68.9% 0.059 120.2)

TraditionalGrass Green」· PaintOlive Green」· Creative Blush Sunrise

#948E78

Ginger · Gray · Sunflower

HEX
#948E78
RGB
rgb(148, 142, 120)
HSL
hsl(47, 12%, 53%)
HSB
hsb(47, 19%, 58%)
CMYK
cmyk(0%, 4%, 19%, 42%)
Oklch
oklch(64.6% 0.032 94.5)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#856565

Crimson · DimGray · Passion Red

HEX
#856565
RGB
rgb(133, 101, 101)
HSL
hsl(0, 14%, 46%)
HSB
hsb(0, 24%, 52%)
CMYK
cmyk(0%, 24%, 24%, 48%)
Oklch
oklch(53.9% 0.041 18.5)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6B75A
5C7AD6

Analogous

D67A5C
D6B75A
B8D65C

Triadic

D6B75A
5CD6B8
B85CD6

Split-Comp.

D6B75A
5CB8D6
7A5CD6

Tetradic

D6B75A
5CD67A
5C7AD6
D65CB8

Contrast Matrix WCAG 2.1 Contrast

D6B75A
BDAA71
96A178
948E78
856565
1.2
Fail
1.4
Fail
1.7
Fail
2.7
Fail
1.2
Fail
1.2
Fail
1.4
Fail
2.3
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.9
Fail
1.7
Fail
1.4
Fail
1.2
Fail
1.6
Fail
2.7
Fail
2.3
Fail
1.9
Fail
1.6
Fail
White BG
1.9Fail
2.3Fail
2.7Fail
3.3AA Large
5.2AA
Black BG
10.8AAA
9.2AAA
7.7AAA
6.4AA
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C871
B5B57F
9B9B82
91917D
777765

Deuteranopia

CACD76
B6B782
9A9984
92927F
797B65

Tritanopia

D48286
BC8A8C
978A8B
948282
836565

Achromatopsia

B6B6B6
A9A9A9
999999
8D8D8D
6F6F6F

Shades & Tints Shades & Tints

#D6B75A

Dark
Light

#BDAA71

Dark
Light

#96A178

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6b75a;
  --color-2: #bdaa71;
  --color-3: #96a178;
  --color-4: #948e78;
  --color-5: #856565;
}

SCSS

$color-1: #d6b75a;
$color-2: #bdaa71;
$color-3: #96a178;
$color-4: #948e78;
$color-5: #856565;

TAILWIND

colors: {
  'brand-1': '#d6b75a',
  'brand-2': '#bdaa71',
  'brand-3': '#96a178',
  'brand-4': '#948e78',
  'brand-5': '#856565',
}

RGB Array

[214, 183, 90], [189, 170, 113], [150, 161, 120], [148, 142, 120], [133, 101, 101]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D6B75A, #BDAA71, #96A178, #948E78, #856565 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d6b75a; --color-2: #bdaa71; --color-3: #96a178; --color-4: #948e78; --color-5: #856565. 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. Restrained colors convey professionalism and trust. 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