#DEE0D5 + #BBB8B4 + #D0C3B3 + #E2D8BF + #FAEFC4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DEE0D5

Willow Green · LightGray · Mint Green

HEX

#DEE0D5

RGB

rgb(222, 224, 213)

HSL

hsl(71, 15%, 86%)

HSB

hsb(71, 5%, 88%)

CMYK

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

Oklch

oklch(90.2% 0.015 115.1)

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

#BBB8B4

Silver Gray · Silver · Pearl Gray

HEX

#BBB8B4

RGB

rgb(187, 184, 180)

HSL

hsl(34, 5%, 72%)

HSB

hsb(34, 4%, 73%)

CMYK

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

Oklch

oklch(78.4% 0.007 75.4)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#D0C3B3

Goose Yellow · Silver · Peach Orange

HEX

#D0C3B3

RGB

rgb(208, 195, 179)

HSL

hsl(33, 24%, 76%)

HSB

hsb(33, 14%, 82%)

CMYK

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

Oklch

oklch(82.3% 0.026 73.1)

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

#E2D8BF

Goose Yellow · Wheat · Lemon Cream

HEX

#E2D8BF

RGB

rgb(226, 216, 191)

HSL

hsl(43, 38%, 82%)

HSB

hsb(43, 15%, 89%)

CMYK

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

Oklch

oklch(88.4% 0.035 88.8)

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

#FAEFC4

Goose Yellow · Bisque · Lemon Cream

HEX

#FAEFC4

RGB

rgb(250, 239, 196)

HSL

hsl(48, 84%, 87%)

HSB

hsb(48, 22%, 98%)

CMYK

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

Oklch

oklch(95.0% 0.057 95.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEE0D5

D8D6E1

Analogous

E1DDD6

DEE0D5

D9E1D6

Triadic

DEE0D5

D6DFE1

E1D6DF

Split-Comp.

DEE0D5

D6D9E1

DDD6E1

Tetradic

DEE0D5

D6E1DD

D8D6E1

E1D6D9

Contrast Matrix WCAG 2.1 Contrast

DEE0D5	BBB8B4	D0C3B3	E2D8BF	FAEFC4
—	1.5 Fail	1.3 Fail	1.1 Fail	1.2 Fail
1.5 Fail	—	1.1 Fail	1.4 Fail	1.7 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.1 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.2 Fail	1.7 Fail	1.5 Fail	1.2 Fail	—

White BG

1.3Fail

2.0Fail

1.7Fail

1.4Fail

1.2Fail

Black BG

15.7AAA

10.6AAA

12.1AAA

14.8AAA

18.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFD8

BABAB5

CACAB7

DEDEC5

F5F5CE

Deuteranopia

DFDFD8

BABAB5

CBCCB8

DEDFC7

F6F7D1

Tritanopia

DEDADA

BBB6B6

CFBABB

E2CACB

F9D7D8

Achromatopsia

DEDEDE

B8B8B8

C5C5C5

D8D8D8

EDEDED

Shades & Tints Shades & Tints

#DEE0D5

Dark

Light

#BBB8B4

Dark

Light

#D0C3B3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dee0d5;
  --color-2: #bbb8b4;
  --color-3: #d0c3b3;
  --color-4: #e2d8bf;
  --color-5: #faefc4;
}

SCSS

$color-1: #dee0d5;
$color-2: #bbb8b4;
$color-3: #d0c3b3;
$color-4: #e2d8bf;
$color-5: #faefc4;

TAILWIND

colors: {
  'brand-1': '#dee0d5',
  'brand-2': '#bbb8b4',
  'brand-3': '#d0c3b3',
  'brand-4': '#e2d8bf',
  'brand-5': '#faefc4',
}

RGB Array

[222, 224, 213], [187, 184, 180], [208, 195, 179], [226, 216, 191], [250, 239, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEE0D5, #BBB8B4, #D0C3B3, #E2D8BF, #FAEFC4 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: #dee0d5; --color-2: #bbb8b4; --color-3: #d0c3b3; --color-4: #e2d8bf; --color-5: #faefc4. 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