#9FF5D9 + #D8DAC6 + #ECC0D4 + #E6B5D2 + #BCABCC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9FF5D9

Jade · LightBlue · Glacier Blue

HEX

#9FF5D9

RGB

rgb(159, 245, 217)

HSL

hsl(160, 81%, 79%)

HSB

hsb(160, 35%, 96%)

CMYK

cmyk(35%, 0%, 11%, 4%)

Oklch

oklch(90.8% 0.092 171.6)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#D8DAC6

Fresh Green · LightGray · Lemon Cream

HEX

#D8DAC6

RGB

rgb(216, 218, 198)

HSL

hsl(66, 21%, 82%)

HSB

hsb(66, 9%, 85%)

CMYK

cmyk(1%, 0%, 9%, 15%)

Oklch

oklch(88.1% 0.027 111.6)

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

#ECC0D4

Rouge · Pink · Cherry Blossom

HEX

#ECC0D4

RGB

rgb(236, 192, 212)

HSL

hsl(333, 54%, 84%)

HSB

hsb(333, 19%, 93%)

CMYK

cmyk(0%, 19%, 10%, 7%)

Oklch

oklch(85.2% 0.056 349.3)

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

#E6B5D2

Mauve · Pink · Cherry Blossom

HEX

#E6B5D2

RGB

rgb(230, 181, 210)

HSL

hsl(324, 49%, 81%)

HSB

hsb(324, 21%, 90%)

CMYK

cmyk(0%, 21%, 9%, 10%)

Oklch

oklch(82.6% 0.068 342.4)

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

#BCABCC

Lilac · Silver · Lilac Purple

HEX

#BCABCC

RGB

rgb(188, 171, 204)

HSL

hsl(271, 24%, 74%)

HSB

hsb(271, 16%, 80%)

CMYK

cmyk(8%, 16%, 0%, 20%)

Oklch

oklch(76.6% 0.050 308.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9FF5D9

F59EBB

Analogous

9EF5AD

9FF5D9

9EE6F5

Triadic

9FF5D9

D89EF5

F5D89E

Split-Comp.

9FF5D9

F59EE6

F5AD9E

Tetradic

9FF5D9

AD9EF5

F59EBB

E6F59E

Contrast Matrix WCAG 2.1 Contrast

9FF5D9	D8DAC6	ECC0D4	E6B5D2	BCABCC
—	1.1 Fail	1.3 Fail	1.4 Fail	1.7 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.5 Fail
1.3 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.4 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.7 Fail	1.5 Fail	1.3 Fail	1.2 Fail	—

White BG

1.3Fail

1.4Fail

1.6Fail

1.8Fail

2.1Fail

Black BG

16.5AAA

14.8AAA

13.1AAA

11.9AAA

9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C5E0

D9D9CB

D9D9CF

D1D0CB

B5B4C4

Deuteranopia

BFB9E1

D9D9CC

DCDFCE

D4D7C9

B6B7C2

Tritanopia

A3E5E6

D8CFD0

EACBCB

E4C5C4

BBBEBC

Achromatopsia

D8D8D8

D7D7D7

CFCFCF

C7C7C7

B4B4B4

Shades & Tints Shades & Tints

#9FF5D9

Dark

Light

#D8DAC6

Dark

Light

#ECC0D4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9ff5d9;
  --color-2: #d8dac6;
  --color-3: #ecc0d4;
  --color-4: #e6b5d2;
  --color-5: #bcabcc;
}

SCSS

$color-1: #9ff5d9;
$color-2: #d8dac6;
$color-3: #ecc0d4;
$color-4: #e6b5d2;
$color-5: #bcabcc;

TAILWIND

colors: {
  'brand-1': '#9ff5d9',
  'brand-2': '#d8dac6',
  'brand-3': '#ecc0d4',
  'brand-4': '#e6b5d2',
  'brand-5': '#bcabcc',
}

RGB Array

[159, 245, 217], [216, 218, 198], [236, 192, 212], [230, 181, 210], [188, 171, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9FF5D9, #D8DAC6, #ECC0D4, #E6B5D2, #BCABCC 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: #9ff5d9; --color-2: #d8dac6; --color-3: #ecc0d4; --color-4: #e6b5d2; --color-5: #bcabcc. 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