#D3EBDF + #DACCE0 + #DCA8ED + #CD8CDB + #9F91A3 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweet

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#D3EBDF

Jade · LightGray · Mint Green

HEX

#D3EBDF

RGB

rgb(211, 235, 223)

HSL

hsl(150, 37%, 87%)

HSB

hsb(150, 10%, 92%)

CMYK

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

Oklch

oklch(91.9% 0.030 164.3)

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

#DACCE0

Lilac · LightGray · Lavender

HEX

#DACCE0

RGB

rgb(218, 204, 224)

HSL

hsl(282, 24%, 84%)

HSB

hsb(282, 9%, 88%)

CMYK

cmyk(3%, 9%, 0%, 12%)

Oklch

oklch(86.3% 0.031 315.9)

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

#DCA8ED

Lilac · Violet · Lilac Purple

HEX

#DCA8ED

RGB

rgb(220, 168, 237)

HSL

hsl(285, 66%, 79%)

HSB

hsb(285, 29%, 93%)

CMYK

cmyk(7%, 29%, 0%, 7%)

Oklch

oklch(80.2% 0.110 317.7)

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

#CD8CDB

Lilac · Orchid · Lilac Purple

HEX

#CD8CDB

RGB

rgb(205, 140, 219)

HSL

hsl(289, 52%, 70%)

HSB

hsb(289, 36%, 86%)

CMYK

cmyk(6%, 36%, 0%, 14%)

Oklch

oklch(73.2% 0.131 320.3)

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

#9F91A3

Dark Plum · DarkGray · Silver Sand

HEX

#9F91A3

RGB

rgb(159, 145, 163)

HSL

hsl(287, 9%, 60%)

HSB

hsb(287, 11%, 64%)

CMYK

cmyk(2%, 11%, 0%, 36%)

Oklch

oklch(67.5% 0.031 318.7)

Traditional「Dark Plum」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3EBDF

EAD2DE

Analogous

D2EAD2

D3EBDF

D2EAEA

Triadic

D3EBDF

DED2EA

EADED2

Split-Comp.

D3EBDF

EAD2EA

EAD2D2

Tetradic

D3EBDF

D2D2EA

EAD2DE

EAEAD2

Contrast Matrix WCAG 2.1 Contrast

D3EBDF	DACCE0	DCA8ED	CD8CDB	9F91A3
—	1.2 Fail	1.5 Fail	2.0 Fail	2.4 Fail
1.2 Fail	—	1.3 Fail	1.6 Fail	1.9 Fail
1.5 Fail	1.3 Fail	—	1.3 Fail	1.5 Fail
2.0 Fail	1.6 Fail	1.3 Fail	—	1.2 Fail
2.4 Fail	1.9 Fail	1.5 Fail	1.2 Fail	—

White BG

1.3Fail

1.5Fail

1.9Fail

2.5Fail

3.0Fail

Black BG

16.7AAA

13.7AAA

10.9AAA

8.4AAA

7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDEE2

D4D4DB

C5C5DC

B1B0C8

99999F

Deuteranopia

DCDAE3

D5D6DA

C9CCD8

B5BAC3

9A9B9E

Tritanopia

D4E4E5

D9D7D7

D9CFCC

CAB9B5

9E9B9A

Achromatopsia

E2E2E2

D2D2D2

BFBFBF

A8A8A8

979797

Shades & Tints Shades & Tints

#D3EBDF

Dark

Light

#DACCE0

Dark

Light

#DCA8ED

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3ebdf;
  --color-2: #dacce0;
  --color-3: #dca8ed;
  --color-4: #cd8cdb;
  --color-5: #9f91a3;
}

SCSS

$color-1: #d3ebdf;
$color-2: #dacce0;
$color-3: #dca8ed;
$color-4: #cd8cdb;
$color-5: #9f91a3;

TAILWIND

colors: {
  'brand-1': '#d3ebdf',
  'brand-2': '#dacce0',
  'brand-3': '#dca8ed',
  'brand-4': '#cd8cdb',
  'brand-5': '#9f91a3',
}

RGB Array

[211, 235, 223], [218, 204, 224], [220, 168, 237], [205, 140, 219], [159, 145, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #D3EBDF, #DACCE0, #DCA8ED, #CD8CDB, #9F91A3 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: #d3ebdf; --color-2: #dacce0; --color-3: #dca8ed; --color-4: #cd8cdb; --color-5: #9f91a3. 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 pastel-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