#ABDEAD + #BCDEAD + #CDDEAD + #DEDEAD + #EFDEAD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#ABDEAD

Celadon · Silver · Apple Green

HEX

#ABDEAD

RGB

rgb(171, 222, 173)

HSL

hsl(122, 44%, 77%)

HSB

hsb(122, 23%, 87%)

CMYK

cmyk(23%, 0%, 22%, 13%)

Oklch

oklch(85.2% 0.086 145.8)

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

#BCDEAD

Celadon · Silver · Apple Green

HEX

#BCDEAD

RGB

rgb(188, 222, 173)

HSL

hsl(102, 43%, 77%)

HSB

hsb(102, 22%, 87%)

CMYK

cmyk(15%, 0%, 22%, 13%)

Oklch

oklch(86.3% 0.075 136.2)

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

#CDDEAD

Willow Green · Silver · Apple Green

HEX

#CDDEAD

RGB

rgb(205, 222, 173)

HSL

hsl(81, 43%, 77%)

HSB

hsb(81, 22%, 87%)

CMYK

cmyk(8%, 0%, 22%, 13%)

Oklch

oklch(87.5% 0.068 123.3)

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

#DEDEAD

Fresh Green · Wheat · Lemon Cream

HEX

#DEDEAD

RGB

rgb(222, 222, 173)

HSL

hsl(60, 43%, 77%)

HSB

hsb(60, 22%, 87%)

CMYK

cmyk(0%, 0%, 22%, 13%)

Oklch

oklch(88.8% 0.064 107.6)

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

#EFDEAD

Goose Yellow · Wheat · Lemon Cream

HEX

#EFDEAD

RGB

rgb(239, 222, 173)

HSL

hsl(45, 67%, 81%)

HSB

hsb(45, 28%, 94%)

CMYK

cmyk(0%, 7%, 28%, 6%)

Oklch

oklch(90.2% 0.066 91.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABDEAD

DEABDC

Analogous

C3DEAB

ABDEAD

ABDEC6

Triadic

ABDEAD

ACABDE

DEACAB

Split-Comp.

ABDEAD

C6ABDE

DEABC3

Tetradic

ABDEAD

ABC3DE

DEABDC

DEC6AB

Contrast Matrix WCAG 2.1 Contrast

ABDEAD	BCDEAD	CDDEAD	DEDEAD	EFDEAD
—	1.0 Fail	1.1 Fail	1.1 Fail	1.1 Fail
1.0 Fail	—	1.0 Fail	1.1 Fail	1.1 Fail
1.1 Fail	1.0 Fail	—	1.0 Fail	1.1 Fail
1.1 Fail	1.1 Fail	1.0 Fail	—	1.0 Fail
1.1 Fail	1.1 Fail	1.1 Fail	1.0 Fail	—

White BG

1.5Fail

1.4Fail

1.3Fail

Black BG

13.8AAA

14.2AAA

14.6AAA

15.2AAA

15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C2B9

CBCBB9

D4D5B9

DEDEB9

E8E7B9

Deuteranopia

BEBABC

C9C6BC

D3D2BC

DEDEBC

E9EABC

Tritanopia

AEC2C4

BEC2C4

CEC2C4

DEC2C4

EEC2C4

Achromatopsia

C9C9C9

CECECE

D3D3D3

D8D8D8

DDDDDD

Shades & Tints Shades & Tints

#ABDEAD

Dark

Light

#BCDEAD

Dark

Light

#CDDEAD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abdead;
  --color-2: #bcdead;
  --color-3: #cddead;
  --color-4: #dedead;
  --color-5: #efdead;
}

SCSS

$color-1: #abdead;
$color-2: #bcdead;
$color-3: #cddead;
$color-4: #dedead;
$color-5: #efdead;

TAILWIND

colors: {
  'brand-1': '#abdead',
  'brand-2': '#bcdead',
  'brand-3': '#cddead',
  'brand-4': '#dedead',
  'brand-5': '#efdead',
}

RGB Array

[171, 222, 173], [188, 222, 173], [205, 222, 173], [222, 222, 173], [239, 222, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ABDEAD, #BCDEAD, #CDDEAD, #DEDEAD, #EFDEAD 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: #abdead; --color-2: #bcdead; --color-3: #cddead; --color-4: #dedead; --color-5: #efdead. 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