#FCD8D7 + #FFBAB0 + #CEA49E + #A69694 + #D9D3D2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FCD8D7

Peach Pink · Bisque · Cherry Blossom

HEX

#FCD8D7

RGB

rgb(252, 216, 215)

HSL

hsl(2, 86%, 92%)

HSB

hsb(2, 15%, 99%)

CMYK

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

Oklch

oklch(91.2% 0.040 19.8)

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

#FFBAB0

Peach Pink · LightPink · Cherry Blossom

HEX

#FFBAB0

RGB

rgb(255, 186, 176)

HSL

hsl(8, 100%, 85%)

HSB

hsb(8, 31%, 100%)

CMYK

cmyk(0%, 27%, 31%, 0%)

Oklch

oklch(85.0% 0.082 28.2)

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

#CEA49E

Peach Pink · Tan · Coral Red

HEX

#CEA49E

RGB

rgb(206, 164, 158)

HSL

hsl(8, 33%, 71%)

HSB

hsb(8, 23%, 81%)

CMYK

cmyk(0%, 20%, 23%, 19%)

Oklch

oklch(75.5% 0.051 27.7)

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

#A69694

Peach Pink · DarkGray · Silver Sand

HEX

#A69694

RGB

rgb(166, 150, 148)

HSL

hsl(7, 9%, 62%)

HSB

hsb(7, 11%, 65%)

CMYK

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

Oklch

oklch(68.7% 0.019 26.2)

Traditional「Peach Pink」· Paint「Silver Sand」· Creative Urban Concrete

#D9D3D2

Peach Pink · LightGray · Pearl Gray

HEX

#D9D3D2

RGB

rgb(217, 211, 210)

HSL

hsl(9, 8%, 84%)

HSB

hsb(9, 3%, 85%)

CMYK

cmyk(0%, 3%, 3%, 15%)

Oklch

oklch(87.1% 0.007 28.8)

Traditional「Peach Pink」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCD8D7

D9FBFC

Analogous

FCD9E9

FCD8D7

FCECD9

Triadic

FCD8D7

D9FCDA

DAD9FC

Split-Comp.

FCD8D7

D9FCEC

D9E9FC

Tetradic

FCD8D7

E9FCD9

D9FBFC

ECD9FC

Contrast Matrix WCAG 2.1 Contrast

FCD8D7	FFBAB0	CEA49E	A69694	D9D3D2
—	1.2 Fail	1.7 Fail	2.2 Fail	1.1 Fail
1.2 Fail	—	1.4 Fail	1.7 Fail	1.1 Fail
1.7 Fail	1.4 Fail	—	1.3 Fail	1.5 Fail
2.2 Fail	1.7 Fail	1.3 Fail	—	1.9 Fail
1.1 Fail	1.1 Fail	1.5 Fail	1.9 Fail	—

White BG

1.3Fail

1.6Fail

2.2Fail

2.8Fail

1.5Fail

Black BG

15.9AAA

12.9AAA

9.4AAA

7.4AAA

14.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECECD7

E1E1B2

BCBB9F

9F9F94

D6D6D2

Deuteranopia

EFF1D7

E5EAB3

BEC1A0

A0A195

D7D7D2

Tritanopia

FAD7D7

FCB4B5

CCA1A1

A59595

D9D2D2

Achromatopsia

E3E3E3

CDCDCD

B0B0B0

9B9B9B

D5D5D5

Shades & Tints Shades & Tints

#FCD8D7

Dark

Light

#FFBAB0

Dark

Light

#CEA49E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcd8d7;
  --color-2: #ffbab0;
  --color-3: #cea49e;
  --color-4: #a69694;
  --color-5: #d9d3d2;
}

SCSS

$color-1: #fcd8d7;
$color-2: #ffbab0;
$color-3: #cea49e;
$color-4: #a69694;
$color-5: #d9d3d2;

TAILWIND

colors: {
  'brand-1': '#fcd8d7',
  'brand-2': '#ffbab0',
  'brand-3': '#cea49e',
  'brand-4': '#a69694',
  'brand-5': '#d9d3d2',
}

RGB Array

[252, 216, 215], [255, 186, 176], [206, 164, 158], [166, 150, 148], [217, 211, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCD8D7, #FFBAB0, #CEA49E, #A69694, #D9D3D2 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: #fcd8d7; --color-2: #ffbab0; --color-3: #cea49e; --color-4: #a69694; --color-5: #d9d3d2. 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