← Back to Editor

#C6B57D · #B9AE80 · #8D9176 · #767D6B · #7C917E

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

#C6B57D

Ginger · Tan · Sunflower

HEX
#C6B57D
RGB
rgb(198, 181, 125)
HSL
hsl(46, 39%, 63%)
HSB
hsb(46, 37%, 78%)
CMYK
cmyk(0%, 9%, 37%, 22%)
Oklch
oklch(77.4% 0.076 93.2)

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

#B9AE80

Ginger · Tan · Sunflower

HEX
#B9AE80
RGB
rgb(185, 174, 128)
HSL
hsl(48, 29%, 61%)
HSB
hsb(48, 31%, 73%)
CMYK
cmyk(0%, 6%, 31%, 27%)
Oklch
oklch(74.9% 0.063 96.3)

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

#8D9176

Autumn Sage · Gray · Sunflower

HEX
#8D9176
RGB
rgb(141, 145, 118)
HSL
hsl(69, 11%, 52%)
HSB
hsb(69, 19%, 57%)
CMYK
cmyk(3%, 0%, 19%, 43%)
Oklch
oklch(64.6% 0.039 114.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#767D6B

Grass Green · Gray · Warm Gray

HEX
#767D6B
RGB
rgb(118, 125, 107)
HSL
hsl(83, 8%, 45%)
HSB
hsb(83, 14%, 49%)
CMYK
cmyk(6%, 0%, 14%, 51%)
Oklch
oklch(57.8% 0.028 124.6)

Traditional「Grass Green」· Paint「Warm Gray」· Creative Urban Concrete

#7C917E

Celadon · Gray · Warm Gray

HEX
#7C917E
RGB
rgb(124, 145, 126)
HSL
hsl(126, 9%, 53%)
HSB
hsb(126, 14%, 57%)
CMYK
cmyk(14%, 0%, 13%, 43%)
Oklch
oklch(63.4% 0.037 147.8)

Traditional「Celadon」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C6B57D
7C8DC5

Analogous

C58F7C
C6B57D
B2C57C

Triadic

C6B57D
7CC5B4
B47CC5

Split-Comp.

C6B57D
7CB2C5
8F7CC5

Tetradic

C6B57D
7CC58F
7C8DC5
C57CB2

Contrast Matrix WCAG 2.1 Contrast

C6B57D
B9AE80
8D9176
767D6B
7C917E
—
1.1
Fail
1.6
Fail
2.1
Fail
1.7
Fail
1.1
Fail
—
1.5
Fail
1.9
Fail
1.5
Fail
1.6
Fail
1.5
Fail
—
1.3
Fail
1.0
Fail
2.1
Fail
1.9
Fail
1.3
Fail
—
1.3
Fail
1.7
Fail
1.5
Fail
1.0
Fail
1.3
Fail
—
White BG
2.0Fail
2.2Fail
3.3AA Large
4.3AA Large
3.4AA Large
Black BG
10.3AAA
9.4AAA
6.4AA
4.9AA
6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBE8B
B4B48B
8F8F7D
79796F
858583

Deuteranopia

C0C18E
B5B68E
8F8E7E
797870
848284

Tritanopia

C59598
B89496
8D8283
767374
7D8687

Achromatopsia

B4B4B4
ACACAC
8D8D8D
797979
898989

Shades & Tints Shades & Tints

#C6B57D

Dark
Light

#B9AE80

Dark
Light

#8D9176

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c6b57d;
  --color-2: #b9ae80;
  --color-3: #8d9176;
  --color-4: #767d6b;
  --color-5: #7c917e;
}

SCSS

$color-1: #c6b57d;
$color-2: #b9ae80;
$color-3: #8d9176;
$color-4: #767d6b;
$color-5: #7c917e;

TAILWIND

colors: {
  'brand-1': '#c6b57d',
  'brand-2': '#b9ae80',
  'brand-3': '#8d9176',
  'brand-4': '#767d6b',
  'brand-5': '#7c917e',
}

RGB Array

[198, 181, 125], [185, 174, 128], [141, 145, 118], [118, 125, 107], [124, 145, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C6B57D, #B9AE80, #8D9176, #767D6B, #7C917E 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: #c6b57d; --color-2: #b9ae80; --color-3: #8d9176; --color-4: #767d6b; --color-5: #7c917e. 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