#D4CDDF + #E0C9D6 + #E89FA6 + #DE92A3 + #BDC2DD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D4CDDF

Wisteria · LightGray · Lavender

HEX

#D4CDDF

RGB

rgb(212, 205, 223)

HSL

hsl(263, 22%, 84%)

HSB

hsb(263, 8%, 87%)

CMYK

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

Oklch

oklch(85.9% 0.026 303.4)

Traditional「Wisteria」· Paint「Lavender」· Creative Lavender Dream

#E0C9D6

Mauve · LightGray · Cherry Blossom

HEX

#E0C9D6

RGB

rgb(224, 201, 214)

HSL

hsl(326, 27%, 83%)

HSB

hsb(326, 10%, 88%)

CMYK

cmyk(0%, 10%, 4%, 12%)

Oklch

oklch(85.9% 0.031 342.7)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

#E89FA6

Peach Pink · Tan · Coral Red

HEX

#E89FA6

RGB

rgb(232, 159, 166)

HSL

hsl(354, 61%, 77%)

HSB

hsb(354, 31%, 91%)

CMYK

cmyk(0%, 31%, 28%, 9%)

Oklch

oklch(77.5% 0.087 13.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#DE92A3

Peach Pink · DarkSalmon · Coral Red

HEX

#DE92A3

RGB

rgb(222, 146, 163)

HSL

hsl(347, 54%, 72%)

HSB

hsb(347, 34%, 87%)

CMYK

cmyk(0%, 34%, 27%, 13%)

Oklch

oklch(74.1% 0.094 5.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#BDC2DD

Azure · LightSteelBlue · Cobalt Blue

HEX

#BDC2DD

RGB

rgb(189, 194, 221)

HSL

hsl(231, 32%, 80%)

HSB

hsb(231, 14%, 87%)

CMYK

cmyk(14%, 12%, 0%, 13%)

Oklch

oklch(81.9% 0.038 277.2)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4CDDF

D8DFCD

Analogous

CDCFDF

D4CDDF

DDCDDF

Triadic

D4CDDF

DFD4CD

CDDFD4

Split-Comp.

D4CDDF

DFDDCD

CFDFCD

Tetradic

D4CDDF

DFCDCF

D8DFCD

CDDFDD

Contrast Matrix WCAG 2.1 Contrast

D4CDDF	E0C9D6	E89FA6	DE92A3	BDC2DD
—	1.0 Fail	1.4 Fail	1.6 Fail	1.1 Fail
1.0 Fail	—	1.4 Fail	1.5 Fail	1.1 Fail
1.4 Fail	1.4 Fail	—	1.1 Fail	1.2 Fail
1.6 Fail	1.5 Fail	1.1 Fail	—	1.4 Fail
1.1 Fail	1.1 Fail	1.2 Fail	1.4 Fail	—

White BG

1.5Fail

1.6Fail

2.1Fail

2.4Fail

1.8Fail

Black BG

13.6AAA

13.5AAA

9.9AAA

8.7AAA

11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D1DB

D6D6D3

C8C8A4

BDBC9F

BFBFD6

Deuteranopia

D1D2DA

D7D9D2

CDD2A4

C2C79E

BFBED5

Tritanopia

D4D7D6

DFD0D0

E4A3A3

DA9C9B

BDD1D0

Achromatopsia

D1D1D1

B6B6B6

ABABAB

C4C4C4

Shades & Tints Shades & Tints

#D4CDDF

Dark

Light

#E0C9D6

Dark

Light

#E89FA6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4cddf;
  --color-2: #e0c9d6;
  --color-3: #e89fa6;
  --color-4: #de92a3;
  --color-5: #bdc2dd;
}

SCSS

$color-1: #d4cddf;
$color-2: #e0c9d6;
$color-3: #e89fa6;
$color-4: #de92a3;
$color-5: #bdc2dd;

TAILWIND

colors: {
  'brand-1': '#d4cddf',
  'brand-2': '#e0c9d6',
  'brand-3': '#e89fa6',
  'brand-4': '#de92a3',
  'brand-5': '#bdc2dd',
}

RGB Array

[212, 205, 223], [224, 201, 214], [232, 159, 166], [222, 146, 163], [189, 194, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4CDDF, #E0C9D6, #E89FA6, #DE92A3, #BDC2DD 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: #d4cddf; --color-2: #e0c9d6; --color-3: #e89fa6; --color-4: #de92a3; --color-5: #bdc2dd. 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