#DEECBD + #CDD5B7 + #BCB7A8 + #CC7D9B + #DB448F · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DEECBD

Willow Green · Wheat · Mint Green

HEX

#DEECBD

RGB

rgb(222, 236, 189)

HSL

hsl(78, 55%, 83%)

HSB

hsb(78, 20%, 93%)

CMYK

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

Oklch

oklch(92.1% 0.064 121.1)

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

#CDD5B7

Willow Green · Silver · Apple Green

HEX

#CDD5B7

RGB

rgb(205, 213, 183)

HSL

hsl(76, 26%, 78%)

HSB

hsb(76, 14%, 84%)

CMYK

cmyk(4%, 0%, 14%, 16%)

Oklch

oklch(85.9% 0.041 119.4)

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

#BCB7A8

Ginger · DarkGray · Sunflower

HEX

#BCB7A8

RGB

rgb(188, 183, 168)

HSL

hsl(45, 13%, 70%)

HSB

hsb(45, 11%, 74%)

CMYK

cmyk(0%, 3%, 11%, 26%)

Oklch

oklch(77.9% 0.022 91.6)

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

#CC7D9B

Rouge · LightCoral · Rose Pink

HEX

#CC7D9B

RGB

rgb(204, 125, 155)

HSL

hsl(337, 44%, 65%)

HSB

hsb(337, 39%, 80%)

CMYK

cmyk(0%, 39%, 24%, 20%)

Oklch

oklch(68.2% 0.104 355.9)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#DB448F

Dark Violet · MediumVioletRed · Rose Pink

HEX

#DB448F

RGB

rgb(219, 68, 143)

HSL

hsl(330, 68%, 56%)

HSB

hsb(330, 69%, 86%)

CMYK

cmyk(0%, 69%, 35%, 14%)

Oklch

oklch(62.2% 0.199 354.0)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEECBD

CABCEB

Analogous

EBE2BC

DEECBD

C5EBBC

Triadic

DEECBD

BCDDEB

EBBCDD

Split-Comp.

DEECBD

BCC5EB

E2BCEB

Tetradic

DEECBD

BCEBE2

CABCEB

EBBCC5

Contrast Matrix WCAG 2.1 Contrast

DEECBD	CDD5B7	BCB7A8	CC7D9B	DB448F
—	1.2 Fail	1.6 Fail	2.4 Fail	3.2 AA Large
1.2 Fail	—	1.3 Fail	2.0 Fail	2.6 Fail
1.6 Fail	1.3 Fail	—	1.5 Fail	2.0 Fail
2.4 Fail	2.0 Fail	1.5 Fail	—	1.3 Fail
3.2 AA Large	2.6 Fail	2.0 Fail	1.3 Fail	—

White BG

1.2Fail

1.5Fail

2.0Fail

3.0AA Large

4.0AA Large

Black BG

16.8AAA

13.8AAA

10.5AAA

7.0AA

5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E4E4C8

D0D1BE

BABAAC

AAA994

9A987D

Deuteranopia

E3E2CB

D0CFC0

BABBAD

AEB492

A2AE79

Tritanopia

DFD1D3

CDC4C5

BCAEAF

C88E8D

D36F6B

Achromatopsia

E2E2E2

CFCFCF

B7B7B7

989898

7A7A7A

Shades & Tints Shades & Tints

#DEECBD

Dark

Light

#CDD5B7

Dark

Light

#BCB7A8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #deecbd;
  --color-2: #cdd5b7;
  --color-3: #bcb7a8;
  --color-4: #cc7d9b;
  --color-5: #db448f;
}

SCSS

$color-1: #deecbd;
$color-2: #cdd5b7;
$color-3: #bcb7a8;
$color-4: #cc7d9b;
$color-5: #db448f;

TAILWIND

colors: {
  'brand-1': '#deecbd',
  'brand-2': '#cdd5b7',
  'brand-3': '#bcb7a8',
  'brand-4': '#cc7d9b',
  'brand-5': '#db448f',
}

RGB Array

[222, 236, 189], [205, 213, 183], [188, 183, 168], [204, 125, 155], [219, 68, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #DEECBD, #CDD5B7, #BCB7A8, #CC7D9B, #DB448F 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: #deecbd; --color-2: #cdd5b7; --color-3: #bcb7a8; --color-4: #cc7d9b; --color-5: #db448f. 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 cool-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