← Back to Editor

#D4D073 · #BFB767 · #A5AA69 · #BAB171 · #6B6B4E

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

#D4D073

Fresh Green · BurlyWood · Sunflower

HEX
#D4D073
RGB
rgb(212, 208, 115)
HSL
hsl(58, 53%, 64%)
HSB
hsb(58, 46%, 83%)
CMYK
cmyk(0%, 2%, 46%, 17%)
Oklch
oklch(84.1% 0.116 106.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#BFB767

Autumn Sage · Tan · Sunflower

HEX
#BFB767
RGB
rgb(191, 183, 103)
HSL
hsl(55, 41%, 58%)
HSB
hsb(55, 46%, 75%)
CMYK
cmyk(0%, 4%, 46%, 25%)
Oklch
oklch(76.9% 0.102 103.5)

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

#A5AA69

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A5AA69
RGB
rgb(165, 170, 105)
HSL
hsl(65, 28%, 54%)
HSB
hsb(65, 38%, 67%)
CMYK
cmyk(3%, 0%, 38%, 33%)
Oklch
oklch(71.9% 0.087 112.2)

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

#BAB171

Autumn Sage · Tan · Sunflower

HEX
#BAB171
RGB
rgb(186, 177, 113)
HSL
hsl(53, 35%, 59%)
HSB
hsb(53, 39%, 73%)
CMYK
cmyk(0%, 5%, 39%, 27%)
Oklch
oklch(75.3% 0.085 101.3)

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

#6B6B4E

Autumn Sage · DimGray · Honey Gold

HEX
#6B6B4E
RGB
rgb(107, 107, 78)
HSL
hsl(60, 16%, 36%)
HSB
hsb(60, 27%, 42%)
CMYK
cmyk(0%, 0%, 27%, 58%)
Oklch
oklch(52.0% 0.043 107.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4D073
7376D4

Analogous

D4A073
D4D073
A6D473

Triadic

D4D073
73D4D1
D173D4

Split-Comp.

D4D073
73A6D4
A073D4

Tetradic

D4D073
73D4A0
7376D4
D473A6

Contrast Matrix WCAG 2.1 Contrast

D4D073
BFB767
A5AA69
BAB171
6B6B4E
—
1.3
Fail
1.5
Fail
1.4
Fail
3.4
AA Large
1.3
Fail
—
1.2
Fail
1.1
Fail
2.7
Fail
1.5
Fail
1.2
Fail
—
1.1
Fail
2.2
Fail
1.4
Fail
1.1
Fail
1.1
Fail
—
2.5
Fail
3.4
AA Large
2.7
Fail
2.2
Fail
2.5
Fail
—
White BG
1.6Fail
2.1Fail
2.5Fail
2.2Fail
5.5AA
Black BG
13.1AAA
10.2AAA
8.6AAA
9.6AAA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D28A
BCBB7A
A7A779
B6B680
6B6B55

Deuteranopia

D3D38F
BCBD7F
A7A77D
B7B784
6B6B57

Tritanopia

D49B9F
BF8A8D
A58588
BA8D8F
6B5B5C

Achromatopsia

C7C7C7
B0B0B0
A1A1A1
ACACAC
686868

Shades & Tints Shades & Tints

#D4D073

Dark
Light

#BFB767

Dark
Light

#A5AA69

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4d073;
  --color-2: #bfb767;
  --color-3: #a5aa69;
  --color-4: #bab171;
  --color-5: #6b6b4e;
}

SCSS

$color-1: #d4d073;
$color-2: #bfb767;
$color-3: #a5aa69;
$color-4: #bab171;
$color-5: #6b6b4e;

TAILWIND

colors: {
  'brand-1': '#d4d073',
  'brand-2': '#bfb767',
  'brand-3': '#a5aa69',
  'brand-4': '#bab171',
  'brand-5': '#6b6b4e',
}

RGB Array

[212, 208, 115], [191, 183, 103], [165, 170, 105], [186, 177, 113], [107, 107, 78]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4D073, #BFB767, #A5AA69, #BAB171, #6B6B4E 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: #d4d073; --color-2: #bfb767; --color-3: #a5aa69; --color-4: #bab171; --color-5: #6b6b4e. 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