← Back to Editor

#7D7B3E · #B9AE6C · #FAF192 · #B76D46 · #8D5031

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 LibraryData Visualization

Color Details Color Details

#7D7B3E

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#7D7B3E
RGB
rgb(125, 123, 62)
HSL
hsl(58, 34%, 37%)
HSB
hsb(58, 50%, 49%)
CMYK
cmyk(0%, 2%, 50%, 51%)
Oklch
oklch(57.1% 0.083 107.1)

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

#B9AE6C

Autumn Sage · Tan · Sunflower

HEX
#B9AE6C
RGB
rgb(185, 174, 108)
HSL
hsl(51, 35%, 57%)
HSB
hsb(51, 42%, 73%)
CMYK
cmyk(0%, 6%, 42%, 27%)
Oklch
oklch(74.5% 0.087 100.0)

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

#FAF192

Fresh Green · Khaki · Lemon Cream

HEX
#FAF192
RGB
rgb(250, 241, 146)
HSL
hsl(55, 91%, 78%)
HSB
hsb(55, 42%, 98%)
CMYK
cmyk(0%, 4%, 42%, 2%)
Oklch
oklch(94.5% 0.117 103.7)

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

#B76D46

Tangerine · Sienna · Amber Brown

HEX
#B76D46
RGB
rgb(183, 109, 70)
HSL
hsl(21, 45%, 50%)
HSB
hsb(21, 62%, 72%)
CMYK
cmyk(0%, 40%, 62%, 28%)
Oklch
oklch(60.8% 0.109 47.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#8D5031

Tangerine · Sienna · Amber Brown

HEX
#8D5031
RGB
rgb(141, 80, 49)
HSL
hsl(20, 48%, 37%)
HSB
hsb(20, 65%, 55%)
CMYK
cmyk(0%, 43%, 65%, 45%)
Oklch
oklch(49.6% 0.093 46.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7D7B3E
3E407E

Analogous

7E5C3E
7D7B3E
607E3E

Triadic

7D7B3E
3E7E7C
7C3E7E

Split-Comp.

7D7B3E
3E607E
5C3E7E

Tetradic

7D7B3E
3E7E5C
3E407E
7E3E60

Contrast Matrix WCAG 2.1 Contrast

7D7B3E
B9AE6C
FAF192
B76D46
8D5031
—
2.0
Fail
3.8
AA Large
1.1
Fail
1.4
Fail
2.0
Fail
—
1.9
Fail
1.8
Fail
2.8
Fail
3.8
AA Large
1.9
Fail
—
3.4
AA Large
5.4
AA
1.1
Fail
1.8
Fail
3.4
AA Large
—
1.6
Fail
1.4
Fail
2.8
Fail
5.4
AA
1.6
Fail
—
White BG
4.4AA Large
2.2Fail
1.2Fail
4.0AA Large
6.3AA
Black BG
4.8AA
9.3AAA
18.1AAA
5.3AA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C4D
B4B47C
F6F6A9
97964F
737239

Deuteranopia

7C7C50
B5B680
F7F7AF
9BA152
767B3A

Tritanopia

7D585B
B8898B
FABBBF
B35759
8A3E40

Achromatopsia

757575
AAAAAA
E9E9E9
7F7F7F
5F5F5F

Shades & Tints Shades & Tints

#7D7B3E

Dark
Light

#B9AE6C

Dark
Light

#FAF192

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7d7b3e;
  --color-2: #b9ae6c;
  --color-3: #faf192;
  --color-4: #b76d46;
  --color-5: #8d5031;
}

SCSS

$color-1: #7d7b3e;
$color-2: #b9ae6c;
$color-3: #faf192;
$color-4: #b76d46;
$color-5: #8d5031;

TAILWIND

colors: {
  'brand-1': '#7d7b3e',
  'brand-2': '#b9ae6c',
  'brand-3': '#faf192',
  'brand-4': '#b76d46',
  'brand-5': '#8d5031',
}

RGB Array

[125, 123, 62], [185, 174, 108], [250, 241, 146], [183, 109, 70], [141, 80, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7D7B3E, #B9AE6C, #FAF192, #B76D46, #8D5031 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #7d7b3e; --color-2: #b9ae6c; --color-3: #faf192; --color-4: #b76d46; --color-5: #8d5031. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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