#C8D9E3 + #E1D9CB + #D9ACA3 + #D3969E + #D888A7 · muted - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C8D9E3

Sky Blue · LightGray · Sky Blue

HEX

#C8D9E3

RGB

rgb(200, 217, 227)

HSL

hsl(202, 33%, 84%)

HSB

hsb(202, 12%, 89%)

CMYK

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

Oklch

oklch(87.6% 0.023 233.4)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

#E1D9CB

Goose Yellow · LightGray · Peach Orange

HEX

#E1D9CB

RGB

rgb(225, 217, 203)

HSL

hsl(38, 27%, 84%)

HSB

hsb(38, 10%, 88%)

CMYK

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

Oklch

oklch(88.8% 0.021 81.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#D9ACA3

Peach Pink · Tan · Coral Red

HEX

#D9ACA3

RGB

rgb(217, 172, 163)

HSL

hsl(10, 42%, 75%)

HSB

hsb(10, 25%, 85%)

CMYK

cmyk(0%, 21%, 25%, 15%)

Oklch

oklch(78.3% 0.055 31.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#D3969E

Peach Pink · Tan · Coral Red

HEX

#D3969E

RGB

rgb(211, 150, 158)

HSL

hsl(352, 41%, 71%)

HSB

hsb(352, 29%, 83%)

CMYK

cmyk(0%, 29%, 25%, 17%)

Oklch

oklch(73.4% 0.074 10.4)

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

#D888A7

Rouge · LightCoral · Rose Pink

HEX

#D888A7

RGB

rgb(216, 136, 167)

HSL

hsl(337, 51%, 69%)

HSB

hsb(337, 37%, 85%)

CMYK

cmyk(0%, 37%, 23%, 15%)

Oklch

oklch(71.8% 0.105 355.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8D9E3

E4D3C9

Analogous

C9E4E0

C8D9E3

C9CCE4

Triadic

C8D9E3

E4C9DA

DAE4C9

Split-Comp.

C8D9E3

E4C9CC

E4E0C9

Tetradic

C8D9E3

E0C9E4

E4D3C9

CCE4C9

Contrast Matrix WCAG 2.1 Contrast

C8D9E3	E1D9CB	D9ACA3	D3969E	D888A7
—	1.0 Fail	1.4 Fail	1.7 Fail	1.8 Fail
1.0 Fail	—	1.4 Fail	1.7 Fail	1.9 Fail
1.4 Fail	1.4 Fail	—	1.2 Fail	1.3 Fail
1.7 Fail	1.7 Fail	1.2 Fail	—	1.1 Fail
1.8 Fail	1.9 Fail	1.3 Fail	1.1 Fail	—

White BG

1.4Fail

2.0Fail

2.4Fail

2.6Fail

Black BG

14.5AAA

15.0AAA

10.4AAA

8.6AAA

8.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFD0E1

DEDDCE

C6C5A5

B9B89C

B5B59F

Deuteranopia

CECDE0

DEDFCF

C8CBA6

BCC19C

BAC09E

Tritanopia

C9DFDE

E1D1D2

D7A7A7

D09B9A

D49A98

Achromatopsia

D5D5D5

DADADA

B8B8B8

A9A9A9

A3A3A3

Shades & Tints Shades & Tints

#C8D9E3

Dark

Light

#E1D9CB

Dark

Light

#D9ACA3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8d9e3;
  --color-2: #e1d9cb;
  --color-3: #d9aca3;
  --color-4: #d3969e;
  --color-5: #d888a7;
}

SCSS

$color-1: #c8d9e3;
$color-2: #e1d9cb;
$color-3: #d9aca3;
$color-4: #d3969e;
$color-5: #d888a7;

TAILWIND

colors: {
  'brand-1': '#c8d9e3',
  'brand-2': '#e1d9cb',
  'brand-3': '#d9aca3',
  'brand-4': '#d3969e',
  'brand-5': '#d888a7',
}

RGB Array

[200, 217, 227], [225, 217, 203], [217, 172, 163], [211, 150, 158], [216, 136, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #C8D9E3, #E1D9CB, #D9ACA3, #D3969E, #D888A7 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: #c8d9e3; --color-2: #e1d9cb; --color-3: #d9aca3; --color-4: #d3969e; --color-5: #d888a7. 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 muted-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