#D9BDE6 + #E1E5DF + #CECCF8 + #C7B5F7 + #A8A5F7 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D9BDE6

Lilac · LightGray · Lavender

HEX

#D9BDE6

RGB

rgb(217, 189, 230)

HSL

hsl(281, 45%, 82%)

HSB

hsb(281, 18%, 90%)

CMYK

cmyk(6%, 18%, 0%, 10%)

Oklch

oklch(83.5% 0.064 315.1)

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

#E1E5DF

Celadon · LightGray · Mint Green

HEX

#E1E5DF

RGB

rgb(225, 229, 223)

HSL

hsl(100, 10%, 89%)

HSB

hsb(100, 3%, 90%)

CMYK

cmyk(2%, 0%, 3%, 10%)

Oklch

oklch(91.7% 0.009 134.9)

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

#CECCF8

Wisteria · Lavender · Sky Blue

HEX

#CECCF8

RGB

rgb(206, 204, 248)

HSL

hsl(243, 76%, 89%)

HSB

hsb(243, 18%, 97%)

CMYK

cmyk(17%, 18%, 0%, 3%)

Oklch

oklch(86.1% 0.061 287.1)

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

#C7B5F7

Wisteria · LightSteelBlue · Sky Blue

HEX

#C7B5F7

RGB

rgb(199, 181, 247)

HSL

hsl(256, 80%, 84%)

HSB

hsb(256, 27%, 97%)

CMYK

cmyk(19%, 27%, 0%, 3%)

Oklch

oklch(81.1% 0.094 296.8)

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

#A8A5F7

Wisteria · LightSteelBlue · Sky Blue

HEX

#A8A5F7

RGB

rgb(168, 165, 247)

HSL

hsl(242, 84%, 81%)

HSB

hsb(242, 33%, 97%)

CMYK

cmyk(32%, 33%, 0%, 3%)

Oklch

oklch(75.6% 0.117 284.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D9BDE6

CAE6BC

Analogous

C4BCE6

D9BDE6

E6BCDE

Triadic

D9BDE6

E6D9BC

BCE6D9

Split-Comp.

D9BDE6

DEE6BC

BCE6C4

Tetradic

D9BDE6

E6C4BC

CAE6BC

BCDEE6

Contrast Matrix WCAG 2.1 Contrast

D9BDE6	E1E5DF	CECCF8	C7B5F7	A8A5F7
—	1.3 Fail	1.1 Fail	1.1 Fail	1.3 Fail
1.3 Fail	—	1.2 Fail	1.4 Fail	1.8 Fail
1.1 Fail	1.2 Fail	—	1.2 Fail	1.5 Fail
1.1 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.3 Fail	1.8 Fail	1.5 Fail	1.2 Fail	—

White BG

1.7Fail

1.3Fail

1.5Fail

1.8Fail

2.2Fail

Black BG

12.4AAA

16.5AAA

13.6AAA

11.4AAA

9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCDDC

E3E3E0

CDCDED

BFBFE7

A7A7E3

Deuteranopia

CFD1DA

E3E2E1

CDCDEB

C0C2E3

A7A7DE

Tritanopia

D8D4D3

E1E2E2

CEE5E3

C6DAD8

A8D3D0

Achromatopsia

CACACA

E3E3E3

D2D2D2

C2C2C2

AFAFAF

Shades & Tints Shades & Tints

#D9BDE6

Dark

Light

#E1E5DF

Dark

Light

#CECCF8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d9bde6;
  --color-2: #e1e5df;
  --color-3: #ceccf8;
  --color-4: #c7b5f7;
  --color-5: #a8a5f7;
}

SCSS

$color-1: #d9bde6;
$color-2: #e1e5df;
$color-3: #ceccf8;
$color-4: #c7b5f7;
$color-5: #a8a5f7;

TAILWIND

colors: {
  'brand-1': '#d9bde6',
  'brand-2': '#e1e5df',
  'brand-3': '#ceccf8',
  'brand-4': '#c7b5f7',
  'brand-5': '#a8a5f7',
}

RGB Array

[217, 189, 230], [225, 229, 223], [206, 204, 248], [199, 181, 247], [168, 165, 247]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #D9BDE6, #E1E5DF, #CECCF8, #C7B5F7, #A8A5F7 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: #d9bde6; --color-2: #e1e5df; --color-3: #ceccf8; --color-4: #c7b5f7; --color-5: #a8a5f7. 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