#E2E3CE + #C5E685 + #97FC0F + #5BC997 + #80A4A4 · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E2E3CE

Fresh Green · LightGray · Lemon Cream

HEX

#E2E3CE

RGB

rgb(226, 227, 206)

HSL

hsl(63, 27%, 85%)

HSB

hsb(63, 9%, 89%)

CMYK

cmyk(0%, 0%, 9%, 11%)

Oklch

oklch(90.9% 0.028 109.2)

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

#C5E685

Willow Green · Khaki · Apple Green

HEX

#C5E685

RGB

rgb(197, 230, 133)

HSL

hsl(80, 66%, 71%)

HSB

hsb(80, 42%, 90%)

CMYK

cmyk(14%, 0%, 42%, 10%)

Oklch

oklch(87.9% 0.129 124.4)

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

#97FC0F

Grass Green · Chartreuse · Olive Green

HEX

#97FC0F

RGB

rgb(151, 252, 15)

HSL

hsl(86, 98%, 52%)

HSB

hsb(86, 94%, 99%)

CMYK

cmyk(40%, 0%, 94%, 1%)

Oklch

oklch(89.4% 0.249 132.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#5BC997

Mineral Blue · MediumAquaMarine · Olive Green

HEX

#5BC997

RGB

rgb(91, 201, 151)

HSL

hsl(153, 50%, 57%)

HSB

hsb(153, 55%, 79%)

CMYK

cmyk(55%, 0%, 25%, 21%)

Oklch

oklch(75.8% 0.126 161.5)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#80A4A4

Slate Blue · LightSlateGray · Lake Green

HEX

#80A4A4

RGB

rgb(128, 164, 164)

HSL

hsl(180, 17%, 57%)

HSB

hsb(180, 22%, 64%)

CMYK

cmyk(22%, 0%, 0%, 36%)

Oklch

oklch(69.2% 0.039 196.3)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E2E3CE

CFCEE3

Analogous

E3DACE

E2E3CE

D8E3CE

Triadic

E2E3CE

CEE2E3

E3CEE2

Split-Comp.

E2E3CE

CED8E3

DACEE3

Tetradic

E2E3CE

CEE3DA

CFCEE3

E3CED8

Contrast Matrix WCAG 2.1 Contrast

E2E3CE	C5E685	97FC0F	5BC997	80A4A4
—	1.1 Fail	1.0 Fail	1.6 Fail	2.1 Fail
1.1 Fail	—	1.1 Fail	1.5 Fail	1.9 Fail
1.0 Fail	1.1 Fail	—	1.6 Fail	2.1 Fail
1.6 Fail	1.5 Fail	1.6 Fail	—	1.3 Fail
2.1 Fail	1.9 Fail	2.1 Fail	1.3 Fail	—

White BG

1.3Fail

1.4Fail

1.3Fail

2.0Fail

2.7Fail

Black BG

16.1AAA

15.0AAA

16.2AAA

10.2AAA

7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E2D3

D3D49C

C3C448

8B8CA3

9090A4

Deuteranopia

E2E2D4

D1CFA2

BDB556

847CA6

8E8BA4

Tritanopia

E2D7D8

C7AFB3

9C7680

61ADAF

82A4A4

Achromatopsia

E0E0E0

D1D1D1

C3C3C3

A2A2A2

999999

Shades & Tints Shades & Tints

#E2E3CE

Dark

Light

#C5E685

Dark

Light

#97FC0F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e2e3ce;
  --color-2: #c5e685;
  --color-3: #97fc0f;
  --color-4: #5bc997;
  --color-5: #80a4a4;
}

SCSS

$color-1: #e2e3ce;
$color-2: #c5e685;
$color-3: #97fc0f;
$color-4: #5bc997;
$color-5: #80a4a4;

TAILWIND

colors: {
  'brand-1': '#e2e3ce',
  'brand-2': '#c5e685',
  'brand-3': '#97fc0f',
  'brand-4': '#5bc997',
  'brand-5': '#80a4a4',
}

RGB Array

[226, 227, 206], [197, 230, 133], [151, 252, 15], [91, 201, 151], [128, 164, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #E2E3CE, #C5E685, #97FC0F, #5BC997, #80A4A4 is ideal for: corporate websites, product showcases, portfolios. 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: #e2e3ce; --color-2: #c5e685; --color-3: #97fc0f; --color-4: #5bc997; --color-5: #80a4a4. 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 dark-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