← Back to Editor

#8F766B · #E6ED07 · #DADBA9 · #BEBF93 · #8E8F6B

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

#8F766B

Tangerine · Gray · Amber Brown

HEX
#8F766B
RGB
rgb(143, 118, 107)
HSL
hsl(18, 14%, 49%)
HSB
hsb(18, 25%, 56%)
CMYK
cmyk(0%, 17%, 25%, 44%)
Oklch
oklch(58.6% 0.036 45.1)

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

#E6ED07

Autumn Sage · Yellow · Honey Gold

HEX
#E6ED07
RGB
rgb(230, 237, 7)
HSL
hsl(62, 94%, 48%)
HSB
hsb(62, 97%, 93%)
CMYK
cmyk(3%, 0%, 97%, 7%)
Oklch
oklch(91.0% 0.201 111.9)

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

#DADBA9

Fresh Green · Wheat · Lemon Cream

HEX
#DADBA9
RGB
rgb(218, 219, 169)
HSL
hsl(61, 41%, 76%)
HSB
hsb(61, 23%, 86%)
CMYK
cmyk(0%, 0%, 23%, 14%)
Oklch
oklch(87.8% 0.066 108.6)

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

#BEBF93

Fresh Green · Tan · Sunflower

HEX
#BEBF93
RGB
rgb(190, 191, 147)
HSL
hsl(61, 26%, 66%)
HSB
hsb(61, 23%, 75%)
CMYK
cmyk(1%, 0%, 23%, 25%)
Oklch
oklch(79.3% 0.059 108.8)

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

#8E8F6B

Autumn Sage · Gray · Honey Gold

HEX
#8E8F6B
RGB
rgb(142, 143, 107)
HSL
hsl(62, 14%, 49%)
HSB
hsb(62, 25%, 56%)
CMYK
cmyk(1%, 0%, 25%, 44%)
Oklch
oklch(64.0% 0.051 109.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F766B
6B848E

Analogous

8E6B72
8F766B
8E876B

Triadic

8F766B
6B8E76
766B8E

Split-Comp.

8F766B
6B8E87
6B728E

Tetradic

8F766B
728E6B
6B848E
876B8E

Contrast Matrix WCAG 2.1 Contrast

8F766B
E6ED07
DADBA9
BEBF93
8E8F6B
—
3.3
AA Large
3.0
Fail
2.2
Fail
1.3
Fail
3.3
AA Large
—
1.1
Fail
1.5
Fail
2.6
Fail
3.0
Fail
1.1
Fail
—
1.3
Fail
2.3
Fail
2.2
Fail
1.5
Fail
1.3
Fail
—
1.8
Fail
1.3
Fail
2.6
Fail
2.3
Fail
1.8
Fail
—
White BG
4.2AA Large
1.3Fail
1.4Fail
1.9Fail
3.3AA Large
Black BG
5.0AA
16.5AAA
14.7AAA
11.1AAA
6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

84846E
E9E93F
DADAB5
BEBE9E
8E8E74

Deuteranopia

86886E
E9E84C
DADAB8
BEBEA0
8E8E76

Tritanopia

8E7070
E66B74
DABFC1
BEA6A8
8E7B7C

Achromatopsia

7C7C7C
D1D1D1
D5D5D5
BABABA
8B8B8B

Shades & Tints Shades & Tints

#8F766B

Dark
Light

#E6ED07

Dark
Light

#DADBA9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f766b;
  --color-2: #e6ed07;
  --color-3: #dadba9;
  --color-4: #bebf93;
  --color-5: #8e8f6b;
}

SCSS

$color-1: #8f766b;
$color-2: #e6ed07;
$color-3: #dadba9;
$color-4: #bebf93;
$color-5: #8e8f6b;

TAILWIND

colors: {
  'brand-1': '#8f766b',
  'brand-2': '#e6ed07',
  'brand-3': '#dadba9',
  'brand-4': '#bebf93',
  'brand-5': '#8e8f6b',
}

RGB Array

[143, 118, 107], [230, 237, 7], [218, 219, 169], [190, 191, 147], [142, 143, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F766B, #E6ED07, #DADBA9, #BEBF93, #8E8F6B 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: #8f766b; --color-2: #e6ed07; --color-3: #dadba9; --color-4: #bebf93; --color-5: #8e8f6b. 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