← Back to Editor

#E8E3E5 · #EDB96E · #7A7988 · #5C6879 · #181110

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

#E8E3E5

Rouge · Lavender · Cherry Blossom

HEX
#E8E3E5
RGB
rgb(232, 227, 229)
HSL
hsl(336, 10%, 90%)
HSB
hsb(336, 2%, 91%)
CMYK
cmyk(0%, 2%, 1%, 9%)
Oklch
oklch(92.0% 0.006 350.8)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#EDB96E

Ginger · SandyBrown · Warm Sun

HEX
#EDB96E
RGB
rgb(237, 185, 110)
HSL
hsl(35, 78%, 68%)
HSB
hsb(35, 54%, 93%)
CMYK
cmyk(0%, 22%, 54%, 7%)
Oklch
oklch(81.7% 0.111 75.3)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#7A7988

Ink Gray · Gray · Warm Gray

HEX
#7A7988
RGB
rgb(122, 121, 136)
HSL
hsl(244, 6%, 50%)
HSB
hsb(244, 11%, 53%)
CMYK
cmyk(10%, 11%, 0%, 47%)
Oklch
oklch(58.2% 0.023 288.7)

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

#5C6879

Indigo · DimGray · Navy Blue

HEX
#5C6879
RGB
rgb(92, 104, 121)
HSL
hsl(215, 14%, 42%)
HSB
hsb(215, 24%, 47%)
CMYK
cmyk(24%, 14%, 0%, 53%)
Oklch
oklch(51.3% 0.031 257.1)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#181110

Crimson · Black · Deep Berry

HEX
#181110
RGB
rgb(24, 17, 16)
HSL
hsl(8, 20%, 8%)
HSB
hsb(8, 33%, 9%)
CMYK
cmyk(0%, 29%, 33%, 91%)
Oklch
oklch(18.6% 0.012 27.7)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8E3E5
E3E8E6

Analogous

E8E3E8
E8E3E5
E8E3E3

Triadic

E8E3E5
E5E8E3
E3E5E8

Split-Comp.

E8E3E5
E3E8E3
E3E8E8

Tetradic

E8E3E5
E8E8E3
E3E8E6
E3E3E8

Contrast Matrix WCAG 2.1 Contrast

E8E3E5
EDB96E
7A7988
5C6879
181110
—
1.4
Fail
3.4
AA Large
4.5
AA Large
14.7
AAA
1.4
Fail
—
2.4
Fail
3.2
AA Large
10.4
AAA
3.4
AA Large
2.4
Fail
—
1.3
Fail
4.4
AA Large
4.5
AA Large
3.2
AA Large
1.3
Fail
—
3.3
AA Large
14.7
AAA
10.4
AAA
4.4
AA Large
3.3
AA Large
—
White BG
1.3Fail
1.8Fail
4.3AA Large
5.7AA
18.6AAA
Black BG
16.6AAA
11.8AAA
4.9AA
3.7AA Large
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6E5
D6D680
7A7A84
616175
151510

Deuteranopia

E6E6E4
DADD85
7A7A84
616074
151610

Tritanopia

E8E4E4
EA8E92
7A8281
5D7271
181010

Achromatopsia

E5E5E5
C0C0C0
7B7B7B
666666
131313

Shades & Tints Shades & Tints

#E8E3E5

Dark
Light

#EDB96E

Dark
Light

#7A7988

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8e3e5;
  --color-2: #edb96e;
  --color-3: #7a7988;
  --color-4: #5c6879;
  --color-5: #181110;
}

SCSS

$color-1: #e8e3e5;
$color-2: #edb96e;
$color-3: #7a7988;
$color-4: #5c6879;
$color-5: #181110;

TAILWIND

colors: {
  'brand-1': '#e8e3e5',
  'brand-2': '#edb96e',
  'brand-3': '#7a7988',
  'brand-4': '#5c6879',
  'brand-5': '#181110',
}

RGB Array

[232, 227, 229], [237, 185, 110], [122, 121, 136], [92, 104, 121], [24, 17, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E8E3E5, #EDB96E, #7A7988, #5C6879, #181110 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: #e8e3e5; --color-2: #edb96e; --color-3: #7a7988; --color-4: #5c6879; --color-5: #181110. 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