#FCCCAB + #ECD3B7 + #C7CEBF + #B0CBC3 + #A8C1B7 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FCCCAB

Apricot · Wheat · Peach Orange

HEX

#FCCCAB

RGB

rgb(252, 204, 171)

HSL

hsl(24, 93%, 83%)

HSB

hsb(24, 32%, 99%)

CMYK

cmyk(0%, 19%, 32%, 1%)

Oklch

oklch(87.9% 0.070 56.1)

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

#ECD3B7

Goose Yellow · Wheat · Peach Orange

HEX

#ECD3B7

RGB

rgb(236, 211, 183)

HSL

hsl(32, 58%, 82%)

HSB

hsb(32, 22%, 93%)

CMYK

cmyk(0%, 11%, 22%, 7%)

Oklch

oklch(88.0% 0.047 70.3)

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

#C7CEBF

Willow Green · Silver · Apple Green

HEX

#C7CEBF

RGB

rgb(199, 206, 191)

HSL

hsl(88, 13%, 78%)

HSB

hsb(88, 7%, 81%)

CMYK

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

Oklch

oklch(84.2% 0.022 127.4)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#B0CBC3

Jade · Silver · Lake Green

HEX

#B0CBC3

RGB

rgb(176, 203, 195)

HSL

hsl(162, 21%, 74%)

HSB

hsb(162, 13%, 80%)

CMYK

cmyk(13%, 0%, 4%, 20%)

Oklch

oklch(82.0% 0.031 175.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#A8C1B7

Jade · Silver · Apple Green

HEX

#A8C1B7

RGB

rgb(168, 193, 183)

HSL

hsl(156, 17%, 71%)

HSB

hsb(156, 13%, 76%)

CMYK

cmyk(13%, 0%, 5%, 24%)

Oklch

oklch(78.9% 0.031 169.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCCCAB

ABDCFC

Analogous

FCABB3

FCCCAB

FCF4AB

Triadic

FCCCAB

ABFCCC

CCABFC

Split-Comp.

FCCCAB

ABFCF4

ABB3FC

Tetradic

FCCCAB

B3FCAB

ABDCFC

F4ABFC

Contrast Matrix WCAG 2.1 Contrast

FCCCAB	ECD3B7	C7CEBF	B0CBC3	A8C1B7
—	1.0 Fail	1.1 Fail	1.2 Fail	1.3 Fail
1.0 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.2 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.3 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.5Fail

1.4Fail

1.6Fail

1.7Fail

1.9Fail

Black BG

14.4AAA

14.6AAA

13.0AAA

12.2AAA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E7E7B3

E1E1BE

CACAC3

BCBCC5

B3B3B9

Deuteranopia

EAEEB5

E3E5BF

CAC9C4

BAB8C5

B1B0BA

Tritanopia

FAB9BB

EBC3C4

C7C5C6

B1C6C7

A9BBBC

Achromatopsia

D7D7D7

CACACA

C2C2C2

B8B8B8

Shades & Tints Shades & Tints

#FCCCAB

Dark

Light

#ECD3B7

Dark

Light

#C7CEBF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcccab;
  --color-2: #ecd3b7;
  --color-3: #c7cebf;
  --color-4: #b0cbc3;
  --color-5: #a8c1b7;
}

SCSS

$color-1: #fcccab;
$color-2: #ecd3b7;
$color-3: #c7cebf;
$color-4: #b0cbc3;
$color-5: #a8c1b7;

TAILWIND

colors: {
  'brand-1': '#fcccab',
  'brand-2': '#ecd3b7',
  'brand-3': '#c7cebf',
  'brand-4': '#b0cbc3',
  'brand-5': '#a8c1b7',
}

RGB Array

[252, 204, 171], [236, 211, 183], [199, 206, 191], [176, 203, 195], [168, 193, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FCCCAB, #ECD3B7, #C7CEBF, #B0CBC3, #A8C1B7 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: #fcccab; --color-2: #ecd3b7; --color-3: #c7cebf; --color-4: #b0cbc3; --color-5: #a8c1b7. 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 cool-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