#FBF2D1 + #E2D9B8 + #D1C8A9 + #B4AE98 + #CEB9A8 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FBF2D1

Goose Yellow · Beige · Lemon Cream

HEX

#FBF2D1

RGB

rgb(251, 242, 209)

HSL

hsl(47, 84%, 90%)

HSB

hsb(47, 17%, 98%)

CMYK

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

Oklch

oklch(96.0% 0.044 94.5)

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

#E2D9B8

Goose Yellow · Wheat · Lemon Cream

HEX

#E2D9B8

RGB

rgb(226, 217, 184)

HSL

hsl(47, 42%, 80%)

HSB

hsb(47, 19%, 89%)

CMYK

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

Oklch

oklch(88.4% 0.045 94.5)

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

#D1C8A9

Goose Yellow · Silver · Sunflower

HEX

#D1C8A9

RGB

rgb(209, 200, 169)

HSL

hsl(47, 30%, 74%)

HSB

hsb(47, 19%, 82%)

CMYK

cmyk(0%, 4%, 19%, 18%)

Oklch

oklch(83.2% 0.043 93.7)

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

#B4AE98

Ginger · DarkGray · Sunflower

HEX

#B4AE98

RGB

rgb(180, 174, 152)

HSL

hsl(47, 16%, 65%)

HSB

hsb(47, 16%, 71%)

CMYK

cmyk(0%, 3%, 16%, 29%)

Oklch

oklch(75.0% 0.031 94.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#CEB9A8

Apricot · Silver · Warm Sun

HEX

#CEB9A8

RGB

rgb(206, 185, 168)

HSL

hsl(27, 28%, 73%)

HSB

hsb(27, 18%, 81%)

CMYK

cmyk(0%, 10%, 18%, 19%)

Oklch

oklch(79.9% 0.034 61.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBF2D1

D0D9FB

Analogous

FBDCD0

FBF2D1

EFFBD0

Triadic

FBF2D1

D0FBF2

F2D0FB

Split-Comp.

FBF2D1

D0EFFB

DCD0FB

Tetradic

FBF2D1

D0FBDC

D0D9FB

FBD0EF

Contrast Matrix WCAG 2.1 Contrast

FBF2D1	E2D9B8	D1C8A9	B4AE98	CEB9A8
—	1.3 Fail	1.5 Fail	2.0 Fail	1.7 Fail
1.3 Fail	—	1.2 Fail	1.6 Fail	1.3 Fail
1.5 Fail	1.2 Fail	—	1.3 Fail	1.1 Fail
2.0 Fail	1.6 Fail	1.3 Fail	—	1.2 Fail
1.7 Fail	1.3 Fail	1.1 Fail	1.2 Fail	—

White BG

1.1Fail

1.4Fail

1.7Fail

2.2Fail

1.9Fail

Black BG

18.7AAA

14.9AAA

12.5AAA

9.4AAA

11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F7F7D9

DEDEC0

CDCDB1

B1B19D

C5C5AC

Deuteranopia

F8F8DB

DFDFC2

CECEB2

B2B29F

C6C8AD

Tritanopia

FBDFE1

E2C6C8

D1B6B8

B4A2A2

CDAFB0

Achromatopsia

F1F1F1

D8D8D8

C7C7C7

ADADAD

BDBDBD

Shades & Tints Shades & Tints

#FBF2D1

Dark

Light

#E2D9B8

Dark

Light

#D1C8A9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbf2d1;
  --color-2: #e2d9b8;
  --color-3: #d1c8a9;
  --color-4: #b4ae98;
  --color-5: #ceb9a8;
}

SCSS

$color-1: #fbf2d1;
$color-2: #e2d9b8;
$color-3: #d1c8a9;
$color-4: #b4ae98;
$color-5: #ceb9a8;

TAILWIND

colors: {
  'brand-1': '#fbf2d1',
  'brand-2': '#e2d9b8',
  'brand-3': '#d1c8a9',
  'brand-4': '#b4ae98',
  'brand-5': '#ceb9a8',
}

RGB Array

[251, 242, 209], [226, 217, 184], [209, 200, 169], [180, 174, 152], [206, 185, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FBF2D1, #E2D9B8, #D1C8A9, #B4AE98, #CEB9A8 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: #fbf2d1; --color-2: #e2d9b8; --color-3: #d1c8a9; --color-4: #b4ae98; --color-5: #ceb9a8. 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