← Back to Editor

#E9D769 · #CEB745 · #BFC7B2 · #7E8B82

A 4-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

#E9D769

Fresh Green · Khaki · Sunflower

HEX
#E9D769
RGB
rgb(233, 215, 105)
HSL
hsl(52, 74%, 66%)
HSB
hsb(52, 55%, 91%)
CMYK
cmyk(0%, 8%, 55%, 9%)
Oklch
oklch(87.2% 0.132 100.1)

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

#CEB745

Autumn Sage · GoldenRod · Sunflower

HEX
#CEB745
RGB
rgb(206, 183, 69)
HSL
hsl(50, 58%, 54%)
HSB
hsb(50, 67%, 81%)
CMYK
cmyk(0%, 11%, 67%, 19%)
Oklch
oklch(77.8% 0.134 97.7)

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

#BFC7B2

Willow Green · Silver · Apple Green

HEX
#BFC7B2
RGB
rgb(191, 199, 178)
HSL
hsl(83, 16%, 74%)
HSB
hsb(83, 11%, 78%)
CMYK
cmyk(4%, 0%, 11%, 22%)
Oklch
oklch(81.8% 0.030 124.1)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#7E8B82

Ash · Gray · Warm Gray

HEX
#7E8B82
RGB
rgb(126, 139, 130)
HSL
hsl(138, 5%, 52%)
HSB
hsb(138, 9%, 55%)
CMYK
cmyk(9%, 0%, 6%, 45%)
Oklch
oklch(62.3% 0.020 155.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E9D769
6879E8

Analogous

E89768
E9D769
B9E868

Triadic

E9D769
68E8D7
D768E8

Split-Comp.

E9D769
68B9E8
9768E8

Tetradic

E9D769
68E897
6879E8
E868B9

Contrast Matrix WCAG 2.1 Contrast

E9D769
CEB745
BFC7B2
7E8B82
—
1.4
Fail
1.2
Fail
2.4
Fail
1.4
Fail
—
1.1
Fail
1.8
Fail
1.2
Fail
1.1
Fail
—
2.0
Fail
2.4
Fail
1.8
Fail
2.0
Fail
—
White BG
1.5Fail
2.0Fail
1.7Fail
3.6AA Large
Black BG
14.4AAA
10.5AAA
12.0AAA
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E184
C4C461
C2C3B7
848484

Deuteranopia

E2E48A
C5C767
C2C1B8
838285

Tritanopia

E8999D
CD767B
BFBBBC
7F8686

Achromatopsia

D0D0D0
B1B1B1
C2C2C2
868686

Shades & Tints Shades & Tints

#E9D769

Dark
Light

#CEB745

Dark
Light

#BFC7B2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e9d769;
  --color-2: #ceb745;
  --color-3: #bfc7b2;
  --color-4: #7e8b82;
}

SCSS

$color-1: #e9d769;
$color-2: #ceb745;
$color-3: #bfc7b2;
$color-4: #7e8b82;

TAILWIND

colors: {
  'brand-1': '#e9d769',
  'brand-2': '#ceb745',
  'brand-3': '#bfc7b2',
  'brand-4': '#7e8b82',
}

RGB Array

[233, 215, 105], [206, 183, 69], [191, 199, 178], [126, 139, 130]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #E9D769, #CEB745, #BFC7B2, #7E8B82 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e9d769; --color-2: #ceb745; --color-3: #bfc7b2; --color-4: #7e8b82. 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 4-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