#8D9BC9 + #C5ACDC + #FCBDEF + #F2CCE1 + #E8DAD3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8D9BC9

Azure · DarkGray · Cobalt Blue

HEX

#8D9BC9

RGB

rgb(141, 155, 201)

HSL

hsl(226, 36%, 67%)

HSB

hsb(226, 30%, 79%)

CMYK

cmyk(30%, 23%, 0%, 21%)

Oklch

oklch(69.5% 0.070 271.4)

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

#C5ACDC

Lilac · LightSteelBlue · Lilac Purple

HEX

#C5ACDC

RGB

rgb(197, 172, 220)

HSL

hsl(271, 41%, 77%)

HSB

hsb(271, 22%, 86%)

CMYK

cmyk(10%, 22%, 0%, 14%)

Oklch

oklch(78.2% 0.072 308.3)

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

#FCBDEF

Mauve · Pink · Lavender

HEX

#FCBDEF

RGB

rgb(252, 189, 239)

HSL

hsl(312, 91%, 86%)

HSB

hsb(312, 25%, 99%)

CMYK

cmyk(0%, 25%, 5%, 1%)

Oklch

oklch(87.1% 0.096 333.8)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#F2CCE1

Mauve · Pink · Cherry Blossom

HEX

#F2CCE1

RGB

rgb(242, 204, 225)

HSL

hsl(327, 59%, 87%)

HSB

hsb(327, 16%, 95%)

CMYK

cmyk(0%, 16%, 7%, 5%)

Oklch

oklch(88.4% 0.051 343.8)

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

#E8DAD3

Apricot · LightGray · Peach Orange

HEX

#E8DAD3

RGB

rgb(232, 218, 211)

HSL

hsl(20, 31%, 87%)

HSB

hsb(20, 9%, 91%)

CMYK

cmyk(0%, 6%, 9%, 9%)

Oklch

oklch(89.8% 0.018 48.5)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8D9BC9

C9BB8D

Analogous

8DB9C9

8D9BC9

9D8DC9

Triadic

8D9BC9

C98D9B

9BC98D

Split-Comp.

8D9BC9

C99D8D

B9C98D

Tetradic

8D9BC9

C98DB9

C9BB8D

8DC99D

Contrast Matrix WCAG 2.1 Contrast

8D9BC9	C5ACDC	FCBDEF	F2CCE1	E8DAD3
—	1.3 Fail	1.8 Fail	1.9 Fail	2.0 Fail
1.3 Fail	—	1.3 Fail	1.4 Fail	1.5 Fail
1.8 Fail	1.3 Fail	—	1.1 Fail	1.1 Fail
1.9 Fail	1.4 Fail	1.1 Fail	—	1.1 Fail
2.0 Fail	1.5 Fail	1.1 Fail	1.1 Fail	—

White BG

2.7Fail

2.0Fail

1.5Fail

1.4Fail

Black BG

7.7AAA

10.3AAA

13.7AAA

14.5AAA

15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9393BE

BABAD0

E1E0E3

E2E1DC

E2E2D5

Deuteranopia

9291BB

BCBDCE

E4E9E0

E4E7DB

E3E4D5

Tritanopia

8EB5B3

C4C7C5

F9D9D7

F0D8D7

E7D6D6

Achromatopsia

9C9C9C

B9B9B9

D6D6D6

DADADA

DDDDDD

Shades & Tints Shades & Tints

#8D9BC9

Dark

Light

#C5ACDC

Dark

Light

#FCBDEF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8d9bc9;
  --color-2: #c5acdc;
  --color-3: #fcbdef;
  --color-4: #f2cce1;
  --color-5: #e8dad3;
}

SCSS

$color-1: #8d9bc9;
$color-2: #c5acdc;
$color-3: #fcbdef;
$color-4: #f2cce1;
$color-5: #e8dad3;

TAILWIND

colors: {
  'brand-1': '#8d9bc9',
  'brand-2': '#c5acdc',
  'brand-3': '#fcbdef',
  'brand-4': '#f2cce1',
  'brand-5': '#e8dad3',
}

RGB Array

[141, 155, 201], [197, 172, 220], [252, 189, 239], [242, 204, 225], [232, 218, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8D9BC9, #C5ACDC, #FCBDEF, #F2CCE1, #E8DAD3 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: #8d9bc9; --color-2: #c5acdc; --color-3: #fcbdef; --color-4: #f2cce1; --color-5: #e8dad3. 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