← Back to Editor

#C9BC65 · #F7D074 · #DBA15E · #C7835B · #8C5C50

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

#C9BC65

Autumn Sage · BurlyWood · Sunflower

HEX
#C9BC65
RGB
rgb(201, 188, 101)
HSL
hsl(52, 48%, 59%)
HSB
hsb(52, 50%, 79%)
CMYK
cmyk(0%, 6%, 50%, 21%)
Oklch
oklch(78.8% 0.110 100.9)

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

#F7D074

Goose Yellow · Khaki · Sunflower

HEX
#F7D074
RGB
rgb(247, 208, 116)
HSL
hsl(42, 89%, 71%)
HSB
hsb(42, 53%, 97%)
CMYK
cmyk(0%, 16%, 53%, 3%)
Oklch
oklch(87.2% 0.119 86.9)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#DBA15E

Ginger · SandyBrown · Warm Sun

HEX
#DBA15E
RGB
rgb(219, 161, 94)
HSL
hsl(32, 63%, 61%)
HSB
hsb(32, 57%, 86%)
CMYK
cmyk(0%, 26%, 57%, 14%)
Oklch
oklch(75.0% 0.109 68.8)

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

#C7835B

Tangerine · DarkSalmon · Warm Sun

HEX
#C7835B
RGB
rgb(199, 131, 91)
HSL
hsl(22, 49%, 57%)
HSB
hsb(22, 54%, 78%)
CMYK
cmyk(0%, 34%, 54%, 22%)
Oklch
oklch(67.1% 0.100 50.8)

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

#8C5C50

Crimson · Sienna · Passion Red

HEX
#8C5C50
RGB
rgb(140, 92, 80)
HSL
hsl(12, 27%, 43%)
HSB
hsb(12, 43%, 55%)
CMYK
cmyk(0%, 34%, 43%, 45%)
Oklch
oklch(52.4% 0.066 34.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9BC65
6472C9

Analogous

C98964
C9BC65
A4C964

Triadic

C9BC65
64C9BB
BB64C9

Split-Comp.

C9BC65
64A4C9
8964C9

Tetradic

C9BC65
64C989
6472C9
C964A4

Contrast Matrix WCAG 2.1 Contrast

C9BC65
F7D074
DBA15E
C7835B
8C5C50
—
1.3
Fail
1.2
Fail
1.6
Fail
2.9
Fail
1.3
Fail
—
1.5
Fail
2.1
Fail
3.8
AA Large
1.2
Fail
1.5
Fail
—
1.4
Fail
2.5
Fail
1.6
Fail
2.1
Fail
1.4
Fail
—
1.8
Fail
2.9
Fail
3.8
AA Large
2.5
Fail
1.8
Fail
—
White BG
1.9Fail
1.5Fail
2.3Fail
3.1AA Large
5.6AA
Black BG
10.9AAA
14.2AAA
9.3AAA
6.8AA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C37A
E6E68A
C2C16E
AAA965
777753

Deuteranopia

C4C57F
E8EB90
C5CA72
AEB367
7A7E54

Tritanopia

C88B8E
F59CA0
D87B7E
C46C6E
8A5556

Achromatopsia

B6B6B6
D1D1D1
ABABAB
939393
696969

Shades & Tints Shades & Tints

#C9BC65

Dark
Light

#F7D074

Dark
Light

#DBA15E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9bc65;
  --color-2: #f7d074;
  --color-3: #dba15e;
  --color-4: #c7835b;
  --color-5: #8c5c50;
}

SCSS

$color-1: #c9bc65;
$color-2: #f7d074;
$color-3: #dba15e;
$color-4: #c7835b;
$color-5: #8c5c50;

TAILWIND

colors: {
  'brand-1': '#c9bc65',
  'brand-2': '#f7d074',
  'brand-3': '#dba15e',
  'brand-4': '#c7835b',
  'brand-5': '#8c5c50',
}

RGB Array

[201, 188, 101], [247, 208, 116], [219, 161, 94], [199, 131, 91], [140, 92, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9BC65, #F7D074, #DBA15E, #C7835B, #8C5C50 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: #c9bc65; --color-2: #f7d074; --color-3: #dba15e; --color-4: #c7835b; --color-5: #8c5c50. 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