#D7E891 + #B2E59A + #87DCA2 + #55CAA4 + #39B9A3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D7E891

Willow Green · Khaki · Apple Green

HEX

#D7E891

RGB

rgb(215, 232, 145)

HSL

hsl(72, 65%, 74%)

HSB

hsb(72, 38%, 91%)

CMYK

cmyk(7%, 0%, 38%, 9%)

Oklch

oklch(89.9% 0.112 117.7)

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

#B2E59A

Emerald · LightGreen · Apple Green

HEX

#B2E59A

RGB

rgb(178, 229, 154)

HSL

hsl(101, 59%, 75%)

HSB

hsb(101, 33%, 90%)

CMYK

cmyk(22%, 0%, 33%, 10%)

Oklch

oklch(86.8% 0.113 136.0)

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

#87DCA2

Emerald · LightGreen · Apple Green

HEX

#87DCA2

RGB

rgb(135, 220, 162)

HSL

hsl(139, 55%, 70%)

HSB

hsb(139, 39%, 86%)

CMYK

cmyk(39%, 0%, 26%, 14%)

Oklch

oklch(82.5% 0.117 153.3)

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

#55CAA4

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#55CAA4

RGB

rgb(85, 202, 164)

HSL

hsl(161, 52%, 56%)

HSB

hsb(161, 58%, 79%)

CMYK

cmyk(58%, 0%, 19%, 21%)

Oklch

oklch(76.2% 0.120 168.7)

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

#39B9A3

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#39B9A3

RGB

rgb(57, 185, 163)

HSL

hsl(170, 53%, 47%)

HSB

hsb(170, 69%, 73%)

CMYK

cmyk(69%, 0%, 12%, 27%)

Oklch

oklch(71.1% 0.115 178.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7E891

A392E8

Analogous

E8CE92

D7E891

ABE892

Triadic

D7E891

92D7E8

E892D7

Split-Comp.

D7E891

92ABE8

CE92E8

Tetradic

D7E891

92E8CE

A392E8

E892AB

Contrast Matrix WCAG 2.1 Contrast

D7E891	B2E59A	87DCA2	55CAA4	39B9A3
—	1.1 Fail	1.2 Fail	1.5 Fail	1.8 Fail
1.1 Fail	—	1.1 Fail	1.4 Fail	1.7 Fail
1.2 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.5 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.8 Fail	1.7 Fail	1.5 Fail	1.2 Fail	—

White BG

1.3Fail

1.4Fail

1.6Fail

2.0Fail

2.4Fail

Black BG

15.8AAA

14.6AAA

12.8AAA

10.4AAA

8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDFA6

C8C9AC

ACADB0

8889AD

7072A8

Deuteranopia

DDDCAB

C5C1B1

A7A1B3

8178AF

695FAA

Tritanopia

D8B7BA

B5BABE

8BBBBE

5BB4B6

3FADAD

Achromatopsia

D9D9D9

CDCDCD

BCBCBC

A3A3A3

909090

Shades & Tints Shades & Tints

#D7E891

Dark

Light

#B2E59A

Dark

Light

#87DCA2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7e891;
  --color-2: #b2e59a;
  --color-3: #87dca2;
  --color-4: #55caa4;
  --color-5: #39b9a3;
}

SCSS

$color-1: #d7e891;
$color-2: #b2e59a;
$color-3: #87dca2;
$color-4: #55caa4;
$color-5: #39b9a3;

TAILWIND

colors: {
  'brand-1': '#d7e891',
  'brand-2': '#b2e59a',
  'brand-3': '#87dca2',
  'brand-4': '#55caa4',
  'brand-5': '#39b9a3',
}

RGB Array

[215, 232, 145], [178, 229, 154], [135, 220, 162], [85, 202, 164], [57, 185, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D7E891, #B2E59A, #87DCA2, #55CAA4, #39B9A3 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: #d7e891; --color-2: #b2e59a; --color-3: #87dca2; --color-4: #55caa4; --color-5: #39b9a3. 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 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