#D8E3B8 + #E3CA9F + #DEA799 + #BFA0A4 + #A198A6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D8E3B8

Willow Green · Wheat · Mint Green

HEX

#D8E3B8

RGB

rgb(216, 227, 184)

HSL

hsl(75, 43%, 81%)

HSB

hsb(75, 19%, 89%)

CMYK

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

Oklch

oklch(89.6% 0.058 119.2)

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

#E3CA9F

Goose Yellow · BurlyWood · Peach Orange

HEX

#E3CA9F

RGB

rgb(227, 202, 159)

HSL

hsl(38, 55%, 76%)

HSB

hsb(38, 30%, 89%)

CMYK

cmyk(0%, 11%, 30%, 11%)

Oklch

oklch(84.9% 0.063 81.1)

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

#DEA799

Peach Pink · Tan · Coral Red

HEX

#DEA799

RGB

rgb(222, 167, 153)

HSL

hsl(12, 51%, 74%)

HSB

hsb(12, 31%, 87%)

CMYK

cmyk(0%, 25%, 31%, 13%)

Oklch

oklch(77.6% 0.068 34.7)

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

#BFA0A4

Peach Pink · DarkGray · Coral Red

HEX

#BFA0A4

RGB

rgb(191, 160, 164)

HSL

hsl(352, 19%, 69%)

HSB

hsb(352, 16%, 75%)

CMYK

cmyk(0%, 16%, 14%, 25%)

Oklch

oklch(73.5% 0.037 9.3)

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

#A198A6

Ash · DarkGray · Silver Sand

HEX

#A198A6

RGB

rgb(161, 152, 166)

HSL

hsl(279, 7%, 62%)

HSB

hsb(279, 8%, 65%)

CMYK

cmyk(3%, 8%, 0%, 35%)

Oklch

oklch(69.2% 0.023 313.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E3B8

C4BAE3

Analogous

E3D9BA

D8E3B8

C4E3BA

Triadic

D8E3B8

BAD9E3

E3BAD9

Split-Comp.

D8E3B8

BAC4E3

D9BAE3

Tetradic

D8E3B8

BAE3D9

C4BAE3

E3BAC4

Contrast Matrix WCAG 2.1 Contrast

D8E3B8	E3CA9F	DEA799	BFA0A4	A198A6
—	1.2 Fail	1.5 Fail	1.8 Fail	2.1 Fail
1.2 Fail	—	1.3 Fail	1.5 Fail	1.7 Fail
1.5 Fail	1.3 Fail	—	1.1 Fail	1.3 Fail
1.8 Fail	1.5 Fail	1.1 Fail	—	1.2 Fail
2.1 Fail	1.7 Fail	1.3 Fail	1.2 Fail	—

White BG

1.3Fail

1.6Fail

2.1Fail

2.4Fail

2.8Fail

Black BG

15.6AAA

13.2AAA

10.1AAA

8.8AAA

7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDC2

D8D8A9

C6C69C

B2B1A3

9D9DA3

Deuteranopia

DCDBC5

DADBAC

C9CD9D

B3B6A3

9E9EA2

Tritanopia

D9CBCC

E2B2B3

DB9FA0

BDA2A2

A1A09F

Achromatopsia

DBDBDB

CDCDCD

B6B6B6

AAAAAA

9C9C9C

Shades & Tints Shades & Tints

#D8E3B8

Dark

Light

#E3CA9F

Dark

Light

#DEA799

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e3b8;
  --color-2: #e3ca9f;
  --color-3: #dea799;
  --color-4: #bfa0a4;
  --color-5: #a198a6;
}

SCSS

$color-1: #d8e3b8;
$color-2: #e3ca9f;
$color-3: #dea799;
$color-4: #bfa0a4;
$color-5: #a198a6;

TAILWIND

colors: {
  'brand-1': '#d8e3b8',
  'brand-2': '#e3ca9f',
  'brand-3': '#dea799',
  'brand-4': '#bfa0a4',
  'brand-5': '#a198a6',
}

RGB Array

[216, 227, 184], [227, 202, 159], [222, 167, 153], [191, 160, 164], [161, 152, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8E3B8, #E3CA9F, #DEA799, #BFA0A4, #A198A6 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: #d8e3b8; --color-2: #e3ca9f; --color-3: #dea799; --color-4: #bfa0a4; --color-5: #a198a6. 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