← Back to Editor

#E5F2D5 · #E8E89E · #DABE77 · #CC8D52 · #415F6B

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

#E5F2D5

Willow Green · Beige · Mint Green

HEX
#E5F2D5
RGB
rgb(229, 242, 213)
HSL
hsl(87, 53%, 89%)
HSB
hsb(87, 12%, 95%)
CMYK
cmyk(5%, 0%, 12%, 5%)
Oklch
oklch(94.4% 0.041 126.9)

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

#E8E89E

Fresh Green · Khaki · Lemon Cream

HEX
#E8E89E
RGB
rgb(232, 232, 158)
HSL
hsl(60, 62%, 76%)
HSB
hsb(60, 32%, 91%)
CMYK
cmyk(0%, 0%, 32%, 9%)
Oklch
oklch(91.4% 0.094 108.1)

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

#DABE77

Ginger · BurlyWood · Sunflower

HEX
#DABE77
RGB
rgb(218, 190, 119)
HSL
hsl(43, 57%, 66%)
HSB
hsb(43, 45%, 85%)
CMYK
cmyk(0%, 13%, 45%, 15%)
Oklch
oklch(81.0% 0.096 88.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#CC8D52

Tangerine · SandyBrown · Warm Sun

HEX
#CC8D52
RGB
rgb(204, 141, 82)
HSL
hsl(29, 54%, 56%)
HSB
hsb(29, 60%, 80%)
CMYK
cmyk(0%, 31%, 60%, 20%)
Oklch
oklch(69.4% 0.108 62.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#415F6B

Slate Blue · DarkSlateGray · Mint Ice

HEX
#415F6B
RGB
rgb(65, 95, 107)
HSL
hsl(197, 24%, 34%)
HSB
hsb(197, 39%, 42%)
CMYK
cmyk(39%, 11%, 0%, 58%)
Oklch
oklch(46.7% 0.040 224.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E5F2D5
E1D4F2

Analogous

F2F0D4
E5F2D5
D6F2D4

Triadic

E5F2D5
D4E4F2
F2D4E4

Split-Comp.

E5F2D5
D4D6F2
F0D4F2

Tetradic

E5F2D5
D4F2F0
E1D4F2
F2D4D6

Contrast Matrix WCAG 2.1 Contrast

E5F2D5
E8E89E
DABE77
CC8D52
415F6B
—
1.1
Fail
1.5
Fail
2.4
Fail
5.9
AA
1.1
Fail
—
1.4
Fail
2.2
Fail
5.4
AA
1.5
Fail
1.4
Fail
—
1.5
Fail
3.8
AA Large
2.4
Fail
2.2
Fail
1.5
Fail
—
2.4
Fail
5.9
AA
5.4
AA
3.8
AA Large
2.4
Fail
—
White BG
1.2Fail
1.3Fail
1.8Fail
2.8Fail
6.8AA
Black BG
18.0AAA
16.5AAA
11.6AAA
7.5AAA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBDC
E8E8B0
CECE88
B1B060
4E4E68

Deuteranopia

EAE9DE
E8E8B4
D0D28C
B4B964
4C4A67

Tritanopia

E6E2E3
E8BEC1
D99699
C96C6E
436665

Achromatopsia

EBEBEB
E0E0E0
BEBEBE
999999
575757

Shades & Tints Shades & Tints

#E5F2D5

Dark
Light

#E8E89E

Dark
Light

#DABE77

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e5f2d5;
  --color-2: #e8e89e;
  --color-3: #dabe77;
  --color-4: #cc8d52;
  --color-5: #415f6b;
}

SCSS

$color-1: #e5f2d5;
$color-2: #e8e89e;
$color-3: #dabe77;
$color-4: #cc8d52;
$color-5: #415f6b;

TAILWIND

colors: {
  'brand-1': '#e5f2d5',
  'brand-2': '#e8e89e',
  'brand-3': '#dabe77',
  'brand-4': '#cc8d52',
  'brand-5': '#415f6b',
}

RGB Array

[229, 242, 213], [232, 232, 158], [218, 190, 119], [204, 141, 82], [65, 95, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E5F2D5, #E8E89E, #DABE77, #CC8D52, #415F6B is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #e5f2d5; --color-2: #e8e89e; --color-3: #dabe77; --color-4: #cc8d52; --color-5: #415f6b. 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. 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