#D4E865 + #BEE0A2 + #AECDB8 + #9ECBC8 + #6BDCD2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D4E865

Fresh Green · Khaki · Sunflower

HEX

#D4E865

RGB

rgb(212, 232, 101)

HSL

hsl(69, 74%, 65%)

HSB

hsb(69, 56%, 91%)

CMYK

cmyk(9%, 0%, 56%, 9%)

Oklch

oklch(89.0% 0.157 117.0)

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

#BEE0A2

Celadon · Silver · Apple Green

HEX

#BEE0A2

RGB

rgb(190, 224, 162)

HSL

hsl(93, 50%, 76%)

HSB

hsb(93, 28%, 88%)

CMYK

cmyk(15%, 0%, 28%, 12%)

Oklch

oklch(86.7% 0.090 131.4)

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

#AECDB8

Celadon · Silver · Apple Green

HEX

#AECDB8

RGB

rgb(174, 205, 184)

HSL

hsl(139, 24%, 74%)

HSB

hsb(139, 15%, 80%)

CMYK

cmyk(15%, 0%, 10%, 20%)

Oklch

oklch(82.0% 0.044 155.7)

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

#9ECBC8

Jade · LightSteelBlue · Lake Green

HEX

#9ECBC8

RGB

rgb(158, 203, 200)

HSL

hsl(176, 30%, 71%)

HSB

hsb(176, 22%, 80%)

CMYK

cmyk(22%, 0%, 1%, 20%)

Oklch

oklch(80.9% 0.047 191.2)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#6BDCD2

Jade · MediumTurquoise · Lake Green

HEX

#6BDCD2

RGB

rgb(107, 220, 210)

HSL

hsl(175, 62%, 64%)

HSB

hsb(175, 51%, 86%)

CMYK

cmyk(51%, 0%, 5%, 14%)

Oklch

oklch(82.6% 0.105 187.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4E865

7864E8

Analogous

E8BA64

D4E865

92E864

Triadic

D4E865

64D4E8

E864D4

Split-Comp.

D4E865

6492E8

BA64E8

Tetradic

D4E865

64E8BA

7864E8

E86492

Contrast Matrix WCAG 2.1 Contrast

D4E865	BEE0A2	AECDB8	9ECBC8	6BDCD2
—	1.1 Fail	1.3 Fail	1.3 Fail	1.2 Fail
1.1 Fail	—	1.2 Fail	1.2 Fail	1.1 Fail
1.3 Fail	1.2 Fail	—	1.0 Fail	1.0 Fail
1.3 Fail	1.2 Fail	1.0 Fail	—	1.1 Fail
1.2 Fail	1.1 Fail	1.0 Fail	1.1 Fail	—

White BG

1.4Fail

1.5Fail

1.7Fail

1.8Fail

1.6Fail

Black BG

15.5AAA

14.4AAA

12.2AAA

11.8AAA

12.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDD85

CDCDB1

BBBCBD

B1B2C9

9C9DD4

Deuteranopia

DCDA8C

CBC8B5

BAB7BE

AFACC9

958DD5

Tritanopia

D59EA3

C0BDBF

B0C1C2

A0C9C9

71D6D7

Achromatopsia

D3D3D3

CFCFCF

C1C1C1

BDBDBD

B9B9B9

Shades & Tints Shades & Tints

#D4E865

Dark

Light

#BEE0A2

Dark

Light

#AECDB8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4e865;
  --color-2: #bee0a2;
  --color-3: #aecdb8;
  --color-4: #9ecbc8;
  --color-5: #6bdcd2;
}

SCSS

$color-1: #d4e865;
$color-2: #bee0a2;
$color-3: #aecdb8;
$color-4: #9ecbc8;
$color-5: #6bdcd2;

TAILWIND

colors: {
  'brand-1': '#d4e865',
  'brand-2': '#bee0a2',
  'brand-3': '#aecdb8',
  'brand-4': '#9ecbc8',
  'brand-5': '#6bdcd2',
}

RGB Array

[212, 232, 101], [190, 224, 162], [174, 205, 184], [158, 203, 200], [107, 220, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4E865, #BEE0A2, #AECDB8, #9ECBC8, #6BDCD2 is ideal for: health products, baby brands, fresh-style blogs. 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: #d4e865; --color-2: #bee0a2; --color-3: #aecdb8; --color-4: #9ecbc8; --color-5: #6bdcd2. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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