← Back to Editor

#D9B88D · #C6B38B · #8B9A79 · #74886C · #356E68

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

#D9B88D

Ginger · BurlyWood · Warm Sun

HEX
#D9B88D
RGB
rgb(217, 184, 141)
HSL
hsl(34, 50%, 70%)
HSB
hsb(34, 35%, 85%)
CMYK
cmyk(0%, 15%, 35%, 15%)
Oklch
oklch(80.1% 0.069 73.9)

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

#C6B38B

Ginger · Tan · Sunflower

HEX
#C6B38B
RGB
rgb(198, 179, 139)
HSL
hsl(41, 34%, 66%)
HSB
hsb(41, 30%, 78%)
CMYK
cmyk(0%, 10%, 30%, 22%)
Oklch
oklch(77.3% 0.058 85.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#8B9A79

Grass Green · Gray · Olive Green

HEX
#8B9A79
RGB
rgb(139, 154, 121)
HSL
hsl(87, 14%, 54%)
HSB
hsb(87, 21%, 60%)
CMYK
cmyk(10%, 0%, 21%, 40%)
Oklch
oklch(66.5% 0.050 127.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#74886C

Celadon · Gray · Olive Green

HEX
#74886C
RGB
rgb(116, 136, 108)
HSL
hsl(103, 11%, 48%)
HSB
hsb(103, 21%, 53%)
CMYK
cmyk(15%, 0%, 21%, 47%)
Oklch
oklch(60.3% 0.048 136.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#356E68

Mineral Blue · SeaGreen · Mint Ice

HEX
#356E68
RGB
rgb(53, 110, 104)
HSL
hsl(174, 35%, 32%)
HSB
hsb(174, 52%, 43%)
CMYK
cmyk(52%, 0%, 5%, 57%)
Oklch
oklch(49.8% 0.061 186.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D9B88D
8CADD9

Analogous

D9918C
D9B88D
D4D98C

Triadic

D9B88D
8CD9B8
B88CD9

Split-Comp.

D9B88D
8CD4D9
918CD9

Tetradic

D9B88D
8CD991
8CADD9
D98CD4

Contrast Matrix WCAG 2.1 Contrast

D9B88D
C6B38B
8B9A79
74886C
356E68
—
1.1
Fail
1.6
Fail
2.0
Fail
3.1
AA Large
1.1
Fail
—
1.5
Fail
1.9
Fail
2.9
Fail
1.6
Fail
1.5
Fail
—
1.3
Fail
2.0
Fail
2.0
Fail
1.9
Fail
1.3
Fail
—
1.5
Fail
3.1
AA Large
2.9
Fail
2.0
Fail
1.5
Fail
—
White BG
1.9Fail
2.1Fail
3.0AA Large
3.8AA Large
5.9AA
Black BG
11.2AAA
10.2AAA
7.0AA
5.5AA
3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCA97
BEBE95
919281
7D7D73
4E4E69

Deuteranopia

CDCF9A
BFC097
919083
7C7A74
4A466A

Tritanopia

D7A0A1
C59C9E
8C8789
757879
386B6B

Achromatopsia

BDBDBD
B4B4B4
929292
7F7F7F
5C5C5C

Shades & Tints Shades & Tints

#D9B88D

Dark
Light

#C6B38B

Dark
Light

#8B9A79

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d9b88d;
  --color-2: #c6b38b;
  --color-3: #8b9a79;
  --color-4: #74886c;
  --color-5: #356e68;
}

SCSS

$color-1: #d9b88d;
$color-2: #c6b38b;
$color-3: #8b9a79;
$color-4: #74886c;
$color-5: #356e68;

TAILWIND

colors: {
  'brand-1': '#d9b88d',
  'brand-2': '#c6b38b',
  'brand-3': '#8b9a79',
  'brand-4': '#74886c',
  'brand-5': '#356e68',
}

RGB Array

[217, 184, 141], [198, 179, 139], [139, 154, 121], [116, 136, 108], [53, 110, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D9B88D, #C6B38B, #8B9A79, #74886C, #356E68 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: #d9b88d; --color-2: #c6b38b; --color-3: #8b9a79; --color-4: #74886c; --color-5: #356e68. 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