← Back to Editor

#E8E9AA · #D5D171 · #AAAE76 · #868C84 · #53585D

sunset

A 5-color sunset 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

#E8E9AA

Fresh Green · Wheat · Lemon Cream

HEX
#E8E9AA
RGB
rgb(232, 233, 170)
HSL
hsl(61, 59%, 79%)
HSB
hsb(61, 27%, 91%)
CMYK
cmyk(0%, 0%, 27%, 9%)
Oklch
oklch(91.8% 0.081 108.7)

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

#D5D171

Fresh Green · BurlyWood · Sunflower

HEX
#D5D171
RGB
rgb(213, 209, 113)
HSL
hsl(58, 54%, 64%)
HSB
hsb(58, 47%, 84%)
CMYK
cmyk(0%, 2%, 47%, 16%)
Oklch
oklch(84.4% 0.119 106.6)

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

#AAAE76

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#AAAE76
RGB
rgb(170, 174, 118)
HSL
hsl(64, 26%, 57%)
HSB
hsb(64, 32%, 68%)
CMYK
cmyk(2%, 0%, 32%, 32%)
Oklch
oklch(73.4% 0.076 111.6)

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

#868C84

Ash · Gray · Warm Gray

HEX
#868C84
RGB
rgb(134, 140, 132)
HSL
hsl(105, 3%, 53%)
HSB
hsb(105, 6%, 55%)
CMYK
cmyk(4%, 0%, 6%, 45%)
Oklch
oklch(63.3% 0.014 137.8)

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

#53585D

Ink Gray · DimGray · Charcoal

HEX
#53585D
RGB
rgb(83, 88, 93)
HSL
hsl(210, 6%, 35%)
HSB
hsb(210, 11%, 36%)
CMYK
cmyk(11%, 5%, 0%, 64%)
Oklch
oklch(45.8% 0.010 248.1)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8E9AA
ABAAE9

Analogous

E9CBAA
E8E9AA
C8E9AA

Triadic

E8E9AA
AAE8E9
E9AAE8

Split-Comp.

E8E9AA
AAC8E9
CBAAE9

Tetradic

E8E9AA
AAE9CB
ABAAE9
E9AAC8

Contrast Matrix WCAG 2.1 Contrast

E8E9AA
D5D171
AAAE76
868C84
53585D
—
1.3
Fail
1.8
Fail
2.7
Fail
5.7
AA
1.3
Fail
—
1.5
Fail
2.2
Fail
4.5
AA
1.8
Fail
1.5
Fail
—
1.5
Fail
3.1
AA Large
2.7
Fail
2.2
Fail
1.5
Fail
—
2.1
Fail
5.7
AA
4.5
AA
3.1
AA Large
2.1
Fail
—
White BG
1.3Fail
1.6Fail
2.3Fail
3.4AA Large
7.2AAA
Black BG
16.7AAA
13.2AAA
9.0AAA
6.1AA
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8B9
D3D388
ACAC84
898986
55555C

Deuteranopia

E8E8BD
D4D48E
ACAB87
888886
55555C

Tritanopia

E8C5C8
D59B9F
AA8E91
868788
535B5B

Achromatopsia

E2E2E2
C7C7C7
A6A6A6
898989
575757

Shades & Tints Shades & Tints

#E8E9AA

Dark
Light

#D5D171

Dark
Light

#AAAE76

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8e9aa;
  --color-2: #d5d171;
  --color-3: #aaae76;
  --color-4: #868c84;
  --color-5: #53585d;
}

SCSS

$color-1: #e8e9aa;
$color-2: #d5d171;
$color-3: #aaae76;
$color-4: #868c84;
$color-5: #53585d;

TAILWIND

colors: {
  'brand-1': '#e8e9aa',
  'brand-2': '#d5d171',
  'brand-3': '#aaae76',
  'brand-4': '#868c84',
  'brand-5': '#53585d',
}

RGB Array

[232, 233, 170], [213, 209, 113], [170, 174, 118], [134, 140, 132], [83, 88, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #E8E9AA, #D5D171, #AAAE76, #868C84, #53585D 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: #e8e9aa; --color-2: #d5d171; --color-3: #aaae76; --color-4: #868c84; --color-5: #53585d. 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 sunset-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