← Back to Editor

#EEE6AB · #C5BC8E · #696758 · #45484B · #36393B

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#EEE6AB

Fresh Green · Wheat · Lemon Cream

HEX
#EEE6AB
RGB
rgb(238, 230, 171)
HSL
hsl(53, 66%, 80%)
HSB
hsb(53, 28%, 93%)
CMYK
cmyk(0%, 3%, 28%, 7%)
Oklch
oklch(91.7% 0.076 101.3)

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

#C5BC8E

Fresh Green · Tan · Sunflower

HEX
#C5BC8E
RGB
rgb(197, 188, 142)
HSL
hsl(50, 32%, 66%)
HSB
hsb(50, 28%, 77%)
CMYK
cmyk(0%, 5%, 28%, 23%)
Oklch
oklch(79.1% 0.062 98.3)

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

#696758

Autumn Sage · DimGray · Charcoal

HEX
#696758
RGB
rgb(105, 103, 88)
HSL
hsl(53, 9%, 38%)
HSB
hsb(53, 16%, 41%)
CMYK
cmyk(0%, 2%, 16%, 59%)
Oklch
oklch(51.1% 0.023 100.9)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

#45484B

Dark Cyan · DarkSlateGray · Charcoal

HEX
#45484B
RGB
rgb(69, 72, 75)
HSL
hsl(210, 4%, 28%)
HSB
hsb(210, 8%, 29%)
CMYK
cmyk(8%, 4%, 0%, 71%)
Oklch
oklch(40.0% 0.006 248.0)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#36393B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#36393B
RGB
rgb(54, 57, 59)
HSL
hsl(204, 4%, 22%)
HSB
hsb(204, 8%, 23%)
CMYK
cmyk(8%, 3%, 0%, 77%)
Oklch
oklch(34.2% 0.005 236.7)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EEE6AB
AAB2EE

Analogous

EEC4AA
EEE6AB
D4EEAA

Triadic

EEE6AB
AAEEE6
E6AAEE

Split-Comp.

EEE6AB
AAD4EE
C4AAEE

Tetradic

EEE6AB
AAEEC4
AAB2EE
EEAAD4

Contrast Matrix WCAG 2.1 Contrast

EEE6AB
C5BC8E
696758
45484B
36393B
—
1.5
Fail
4.5
AA Large
7.3
AAA
9.2
AAA
1.5
Fail
—
3.0
Fail
4.8
AA
6.1
AA
4.5
AA Large
3.0
Fail
—
1.6
Fail
2.0
Fail
7.3
AAA
4.8
AA
1.6
Fail
—
1.3
Fail
9.2
AAA
6.1
AA
2.0
Fail
1.3
Fail
—
White BG
1.3Fail
1.9Fail
5.7AA
9.2AAA
11.6AAA
Black BG
16.5AAA
11.0AAA
3.7AA Large
2.3Fail
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEAB9
C1C199
68685C
46464A
37373B

Deuteranopia

EBECBD
C2C29C
68685D
46464A
37373A

Tritanopia

EEC5C7
C5A2A4
695E5F
454A4A
363A3A

Achromatopsia

E2E2E2
B9B9B9
666666
474747
383838

Shades & Tints Shades & Tints

#EEE6AB

Dark
Light

#C5BC8E

Dark
Light

#696758

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eee6ab;
  --color-2: #c5bc8e;
  --color-3: #696758;
  --color-4: #45484b;
  --color-5: #36393b;
}

SCSS

$color-1: #eee6ab;
$color-2: #c5bc8e;
$color-3: #696758;
$color-4: #45484b;
$color-5: #36393b;

TAILWIND

colors: {
  'brand-1': '#eee6ab',
  'brand-2': '#c5bc8e',
  'brand-3': '#696758',
  'brand-4': '#45484b',
  'brand-5': '#36393b',
}

RGB Array

[238, 230, 171], [197, 188, 142], [105, 103, 88], [69, 72, 75], [54, 57, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EEE6AB, #C5BC8E, #696758, #45484B, #36393B is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #eee6ab; --color-2: #c5bc8e; --color-3: #696758; --color-4: #45484b; --color-5: #36393b. 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. Restrained colors convey professionalism and trust. 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