#F4E3CB + #F9EBD5 + #FDF3DE + #ADA4A1 + #C8BFB6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F4E3CB

Goose Yellow · Bisque · Peach Orange

HEX

#F4E3CB

RGB

rgb(244, 227, 203)

HSL

hsl(35, 65%, 88%)

HSB

hsb(35, 17%, 96%)

CMYK

cmyk(0%, 7%, 17%, 4%)

Oklch

oklch(92.3% 0.037 76.6)

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

#F9EBD5

Goose Yellow · Beige · Peach Orange

HEX

#F9EBD5

RGB

rgb(249, 235, 213)

HSL

hsl(37, 75%, 91%)

HSB

hsb(37, 14%, 98%)

CMYK

cmyk(0%, 6%, 14%, 2%)

Oklch

oklch(94.5% 0.033 79.3)

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

#FDF3DE

Goose Yellow · Beige · Lemon Cream

HEX

#FDF3DE

RGB

rgb(253, 243, 222)

HSL

hsl(41, 89%, 93%)

HSB

hsb(41, 12%, 99%)

CMYK

cmyk(0%, 4%, 12%, 1%)

Oklch

oklch(96.6% 0.030 85.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#ADA4A1

Ash · DarkGray · Silver Sand

HEX

#ADA4A1

RGB

rgb(173, 164, 161)

HSL

hsl(15, 7%, 65%)

HSB

hsb(15, 7%, 68%)

CMYK

cmyk(0%, 5%, 7%, 32%)

Oklch

oklch(72.5% 0.011 39.4)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C8BFB6

Goose Yellow · Silver · Warm Sun

HEX

#C8BFB6

RGB

rgb(200, 191, 182)

HSL

hsl(30, 14%, 75%)

HSB

hsb(30, 9%, 78%)

CMYK

cmyk(0%, 4%, 9%, 22%)

Oklch

oklch(80.9% 0.016 67.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4E3CB

CDDDF4

Analogous

F4D0CD

F4E3CB

F1F4CD

Triadic

F4E3CB

CDF4E4

E4CDF4

Split-Comp.

F4E3CB

CDF1F4

D0CDF4

Tetradic

F4E3CB

CDF4D0

CDDDF4

F4CDF1

Contrast Matrix WCAG 2.1 Contrast

F4E3CB	F9EBD5	FDF3DE	ADA4A1	C8BFB6
—	1.1 Fail	1.1 Fail	1.9 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	2.1 Fail	1.5 Fail
1.1 Fail	1.1 Fail	—	2.2 Fail	1.6 Fail
1.9 Fail	2.1 Fail	2.2 Fail	—	1.3 Fail
1.4 Fail	1.5 Fail	1.6 Fail	1.3 Fail	—

White BG

1.3Fail

1.2Fail

1.1Fail

2.4Fail

1.8Fail

Black BG

16.7AAA

17.9AAA

19.1AAA

8.6AAA

11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDECD1

F3F3DA

F9F9E3

A9A9A2

C4C4B8

Deuteranopia

EEEFD2

F4F5DC

F9FAE4

AAAAA2

C5C5B9

Tritanopia

F3D5D6

F8DFDF

FDE7E8

ADA2A2

C8BABA

Achromatopsia

E5E5E5

EDEDED

F4F4F4

A6A6A6

C1C1C1

Shades & Tints Shades & Tints

#F4E3CB

Dark

Light

#F9EBD5

Dark

Light

#FDF3DE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4e3cb;
  --color-2: #f9ebd5;
  --color-3: #fdf3de;
  --color-4: #ada4a1;
  --color-5: #c8bfb6;
}

SCSS

$color-1: #f4e3cb;
$color-2: #f9ebd5;
$color-3: #fdf3de;
$color-4: #ada4a1;
$color-5: #c8bfb6;

TAILWIND

colors: {
  'brand-1': '#f4e3cb',
  'brand-2': '#f9ebd5',
  'brand-3': '#fdf3de',
  'brand-4': '#ada4a1',
  'brand-5': '#c8bfb6',
}

RGB Array

[244, 227, 203], [249, 235, 213], [253, 243, 222], [173, 164, 161], [200, 191, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4E3CB, #F9EBD5, #FDF3DE, #ADA4A1, #C8BFB6 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: #f4e3cb; --color-2: #f9ebd5; --color-3: #fdf3de; --color-4: #ada4a1; --color-5: #c8bfb6. 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