#D3BAB7 + #E0CCC7 + #F3DFCD + #C9DDCB + #9CB8BC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D3BAB7

Peach Pink · Silver · Coral Red

HEX

#D3BAB7

RGB

rgb(211, 186, 183)

HSL

hsl(6, 24%, 77%)

HSB

hsb(6, 13%, 83%)

CMYK

cmyk(0%, 12%, 13%, 17%)

Oklch

oklch(80.9% 0.029 25.9)

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

#E0CCC7

Peach Pink · LightGray · Cherry Blossom

HEX

#E0CCC7

RGB

rgb(224, 204, 199)

HSL

hsl(12, 29%, 83%)

HSB

hsb(12, 11%, 88%)

CMYK

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

Oklch

oklch(86.0% 0.024 34.3)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#F3DFCD

Apricot · Bisque · Peach Orange

HEX

#F3DFCD

RGB

rgb(243, 223, 205)

HSL

hsl(28, 61%, 88%)

HSB

hsb(28, 16%, 95%)

CMYK

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

Oklch

oklch(91.5% 0.033 64.4)

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

#C9DDCB

Celadon · LightGray · Mint Green

HEX

#C9DDCB

RGB

rgb(201, 221, 203)

HSL

hsl(126, 23%, 83%)

HSB

hsb(126, 9%, 87%)

CMYK

cmyk(9%, 0%, 8%, 13%)

Oklch

oklch(87.8% 0.032 148.2)

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

#9CB8BC

Sky Blue · DarkGray · Lake Green

HEX

#9CB8BC

RGB

rgb(156, 184, 188)

HSL

hsl(188, 19%, 67%)

HSB

hsb(188, 17%, 74%)

CMYK

cmyk(17%, 2%, 0%, 26%)

Oklch

oklch(76.3% 0.031 207.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3BAB7

B6D0D2

Analogous

D2B6C2

D3BAB7

D2C7B6

Triadic

D3BAB7

B6D2B9

B9B6D2

Split-Comp.

D3BAB7

B6D2C7

B6C2D2

Tetradic

D3BAB7

C2D2B6

B6D0D2

C7B6D2

Contrast Matrix WCAG 2.1 Contrast

D3BAB7	E0CCC7	F3DFCD	C9DDCB	9CB8BC
—	1.2 Fail	1.4 Fail	1.3 Fail	1.1 Fail
1.2 Fail	—	1.2 Fail	1.1 Fail	1.4 Fail
1.4 Fail	1.2 Fail	—	1.1 Fail	1.6 Fail
1.3 Fail	1.1 Fail	1.1 Fail	—	1.5 Fail
1.1 Fail	1.4 Fail	1.6 Fail	1.5 Fail	—

White BG

1.8Fail

1.5Fail

1.3Fail

1.4Fail

2.1Fail

Black BG

11.5AAA

13.6AAA

16.2AAA

14.7AAA

10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C8B8

D7D7C8

EAEAD1

D2D2CF

A8A8BB

Deuteranopia

CACCB8

D9DAC8

ECEDD2

D1CFD0

A7A4BB

Tritanopia

D2B8B8

DFC9C9

F2D5D6

CAD3D4

9DBABA

Achromatopsia

C1C1C1

D1D1D1

E3E3E3

D5D5D5

B0B0B0

Shades & Tints Shades & Tints

#D3BAB7

Dark

Light

#E0CCC7

Dark

Light

#F3DFCD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3bab7;
  --color-2: #e0ccc7;
  --color-3: #f3dfcd;
  --color-4: #c9ddcb;
  --color-5: #9cb8bc;
}

SCSS

$color-1: #d3bab7;
$color-2: #e0ccc7;
$color-3: #f3dfcd;
$color-4: #c9ddcb;
$color-5: #9cb8bc;

TAILWIND

colors: {
  'brand-1': '#d3bab7',
  'brand-2': '#e0ccc7',
  'brand-3': '#f3dfcd',
  'brand-4': '#c9ddcb',
  'brand-5': '#9cb8bc',
}

RGB Array

[211, 186, 183], [224, 204, 199], [243, 223, 205], [201, 221, 203], [156, 184, 188]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3BAB7, #E0CCC7, #F3DFCD, #C9DDCB, #9CB8BC 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: #d3bab7; --color-2: #e0ccc7; --color-3: #f3dfcd; --color-4: #c9ddcb; --color-5: #9cb8bc. 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