#FCC99C + #F5D9A6 + #ECE8B5 + #D2DBCA + #9AB1B2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FCC99C

Apricot · Wheat · Peach Orange

HEX

#FCC99C

RGB

rgb(252, 201, 156)

HSL

hsl(28, 94%, 80%)

HSB

hsb(28, 38%, 99%)

CMYK

cmyk(0%, 20%, 38%, 1%)

Oklch

oklch(87.0% 0.083 62.8)

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

#F5D9A6

Goose Yellow · Wheat · Peach Orange

HEX

#F5D9A6

RGB

rgb(245, 217, 166)

HSL

hsl(39, 80%, 81%)

HSB

hsb(39, 32%, 96%)

CMYK

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

Oklch

oklch(89.6% 0.073 82.3)

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

#ECE8B5

Fresh Green · Wheat · Lemon Cream

HEX

#ECE8B5

RGB

rgb(236, 232, 181)

HSL

hsl(56, 59%, 82%)

HSB

hsb(56, 23%, 93%)

CMYK

cmyk(0%, 2%, 23%, 7%)

Oklch

oklch(92.2% 0.066 103.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#D2DBCA

Celadon · LightGray · Mint Green

HEX

#D2DBCA

RGB

rgb(210, 219, 202)

HSL

hsl(92, 19%, 83%)

HSB

hsb(92, 8%, 86%)

CMYK

cmyk(4%, 0%, 8%, 14%)

Oklch

oklch(88.0% 0.025 129.9)

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

#9AB1B2

Sky Blue · DarkGray · Lake Green

HEX

#9AB1B2

RGB

rgb(154, 177, 178)

HSL

hsl(183, 13%, 65%)

HSB

hsb(183, 13%, 70%)

CMYK

cmyk(13%, 1%, 0%, 30%)

Oklch

oklch(74.3% 0.025 199.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCC99C

9CCFFC

Analogous

FC9C9F

FCC99C

FCF99C

Triadic

FCC99C

9CFCC9

C99CFC

Split-Comp.

FCC99C

9CFCF9

9C9FFC

Tetradic

FCC99C

9FFC9C

9CCFFC

F99CFC

Contrast Matrix WCAG 2.1 Contrast

FCC99C	F5D9A6	ECE8B5	D2DBCA	9AB1B2
—	1.1 Fail	1.2 Fail	1.1 Fail	1.5 Fail
1.1 Fail	—	1.1 Fail	1.0 Fail	1.7 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.8 Fail
1.1 Fail	1.0 Fail	1.1 Fail	—	1.6 Fail
1.5 Fail	1.7 Fail	1.8 Fail	1.6 Fail	—

White BG

1.5Fail

1.4Fail

1.3Fail

1.4Fail

2.3Fail

Black BG

14.0AAA

15.4AAA

16.8AAA

14.7AAA

9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E5A7

E9E9B2

EAEAC1

D6D6CE

A4A4B2

Deuteranopia

E9EDAA

EBEDB5

EBEBC4

D5D5CF

A3A1B2

Tritanopia

F9AFB1

F4BCBE

ECCBCD

D2D1D2

9BB2B2

Achromatopsia

D3D3D3

DCDCDC

E3E3E3

D6D6D6

AAAAAA

Shades & Tints Shades & Tints

#FCC99C

Dark

Light

#F5D9A6

Dark

Light

#ECE8B5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcc99c;
  --color-2: #f5d9a6;
  --color-3: #ece8b5;
  --color-4: #d2dbca;
  --color-5: #9ab1b2;
}

SCSS

$color-1: #fcc99c;
$color-2: #f5d9a6;
$color-3: #ece8b5;
$color-4: #d2dbca;
$color-5: #9ab1b2;

TAILWIND

colors: {
  'brand-1': '#fcc99c',
  'brand-2': '#f5d9a6',
  'brand-3': '#ece8b5',
  'brand-4': '#d2dbca',
  'brand-5': '#9ab1b2',
}

RGB Array

[252, 201, 156], [245, 217, 166], [236, 232, 181], [210, 219, 202], [154, 177, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCC99C, #F5D9A6, #ECE8B5, #D2DBCA, #9AB1B2 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: #fcc99c; --color-2: #f5d9a6; --color-3: #ece8b5; --color-4: #d2dbca; --color-5: #9ab1b2. 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