#FCE2D1 + #A6BAC5 + #8DA1AC + #F49E9D + #F96879 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FCE2D1

Apricot · Bisque · Peach Orange

HEX

#FCE2D1

RGB

rgb(252, 226, 209)

HSL

hsl(24, 88%, 90%)

HSB

hsb(24, 17%, 99%)

CMYK

cmyk(0%, 10%, 17%, 1%)

Oklch

oklch(93.0% 0.037 55.4)

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

#A6BAC5

Sky Blue · Silver · Cobalt Blue

HEX

#A6BAC5

RGB

rgb(166, 186, 197)

HSL

hsl(201, 21%, 71%)

HSB

hsb(201, 16%, 77%)

CMYK

cmyk(16%, 6%, 0%, 23%)

Oklch

oklch(77.7% 0.027 231.7)

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

#8DA1AC

Sky Blue · DarkGray · Cobalt Blue

HEX

#8DA1AC

RGB

rgb(141, 161, 172)

HSL

hsl(201, 16%, 61%)

HSB

hsb(201, 18%, 67%)

CMYK

cmyk(18%, 6%, 0%, 33%)

Oklch

oklch(69.7% 0.028 231.8)

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

#F49E9D

Peach Pink · LightSalmon · Coral Red

HEX

#F49E9D

RGB

rgb(244, 158, 157)

HSL

hsl(1, 80%, 79%)

HSB

hsb(1, 36%, 96%)

CMYK

cmyk(0%, 35%, 36%, 4%)

Oklch

oklch(78.5% 0.103 20.4)

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

#F96879

Peach Pink · Salmon · Coral Red

HEX

#F96879

RGB

rgb(249, 104, 121)

HSL

hsl(353, 92%, 69%)

HSB

hsb(353, 58%, 98%)

CMYK

cmyk(0%, 58%, 51%, 2%)

Oklch

oklch(70.2% 0.178 15.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCE2D1

CFEAFC

Analogous

FCCFD4

FCE2D1

FCF7CF

Triadic

FCE2D1

CFFCE1

E1CFFC

Split-Comp.

FCE2D1

CFFCF7

CFD4FC

Tetradic

FCE2D1

D4FCCF

CFEAFC

F7CFFC

Contrast Matrix WCAG 2.1 Contrast

FCE2D1	A6BAC5	8DA1AC	F49E9D	F96879
—	1.6 Fail	2.2 Fail	1.7 Fail	2.3 Fail
1.6 Fail	—	1.3 Fail	1.0 Fail	1.4 Fail
2.2 Fail	1.3 Fail	—	1.3 Fail	1.1 Fail
1.7 Fail	1.0 Fail	1.3 Fail	—	1.4 Fail
2.3 Fail	1.4 Fail	1.1 Fail	1.4 Fail	—

White BG

1.2Fail

2.0Fail

2.7Fail

2.1Fail

2.9Fail

Black BG

16.9AAA

10.5AAA

7.8AAA

10.2AAA

7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F1D5

AFAFC2

9696A9

CFCE9D

BAB975

Deuteranopia

F2F4D6

AEACC2

9593A9

D4DA9D

C3CD74

Tritanopia

FBD8D9

A7C0C0

8EA7A7

F09D9D

F27271

Achromatopsia

E8E8E8

B5B5B5

9C9C9C

B8B8B8

959595

Shades & Tints Shades & Tints

#FCE2D1

Dark

Light

#A6BAC5

Dark

Light

#8DA1AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fce2d1;
  --color-2: #a6bac5;
  --color-3: #8da1ac;
  --color-4: #f49e9d;
  --color-5: #f96879;
}

SCSS

$color-1: #fce2d1;
$color-2: #a6bac5;
$color-3: #8da1ac;
$color-4: #f49e9d;
$color-5: #f96879;

TAILWIND

colors: {
  'brand-1': '#fce2d1',
  'brand-2': '#a6bac5',
  'brand-3': '#8da1ac',
  'brand-4': '#f49e9d',
  'brand-5': '#f96879',
}

RGB Array

[252, 226, 209], [166, 186, 197], [141, 161, 172], [244, 158, 157], [249, 104, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCE2D1, #A6BAC5, #8DA1AC, #F49E9D, #F96879 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: #fce2d1; --color-2: #a6bac5; --color-3: #8da1ac; --color-4: #f49e9d; --color-5: #f96879. 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