#D8E3AA + #DBC29A + #E69877 + #D18080 + #876D6D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D8E3AA

Willow Green · Wheat · Apple Green

HEX

#D8E3AA

RGB

rgb(216, 227, 170)

HSL

hsl(72, 50%, 78%)

HSB

hsb(72, 25%, 89%)

CMYK

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

Oklch

oklch(89.3% 0.076 116.8)

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

#DBC29A

Goose Yellow · BurlyWood · Warm Sun

HEX

#DBC29A

RGB

rgb(219, 194, 154)

HSL

hsl(37, 47%, 73%)

HSB

hsb(37, 30%, 86%)

CMYK

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

Oklch

oklch(82.5% 0.060 79.4)

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

#E69877

Apricot · DarkSalmon · Warm Sun

HEX

#E69877

RGB

rgb(230, 152, 119)

HSL

hsl(18, 69%, 68%)

HSB

hsb(18, 48%, 90%)

CMYK

cmyk(0%, 34%, 48%, 10%)

Oklch

oklch(75.0% 0.105 43.7)

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

#D18080

Peach Pink · LightCoral · Coral Red

HEX

#D18080

RGB

rgb(209, 128, 128)

HSL

hsl(0, 47%, 66%)

HSB

hsb(0, 39%, 82%)

CMYK

cmyk(0%, 39%, 39%, 18%)

Oklch

oklch(68.5% 0.101 20.0)

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

#876D6D

Crimson · Gray · Passion Red

HEX

#876D6D

RGB

rgb(135, 109, 109)

HSL

hsl(0, 11%, 48%)

HSB

hsb(0, 19%, 53%)

CMYK

cmyk(0%, 19%, 19%, 47%)

Oklch

oklch(56.0% 0.033 18.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E3AA

B6ABE3

Analogous

E3D2AB

D8E3AA

BCE3AB

Triadic

D8E3AA

ABD8E3

E3ABD8

Split-Comp.

D8E3AA

ABBCE3

D2ABE3

Tetradic

D8E3AA

ABE3D2

B6ABE3

E3ABBC

Contrast Matrix WCAG 2.1 Contrast

D8E3AA	DBC29A	E69877	D18080	876D6D
—	1.3 Fail	1.7 Fail	2.2 Fail	3.5 AA Large
1.3 Fail	—	1.3 Fail	1.7 Fail	2.7 Fail
1.7 Fail	1.3 Fail	—	1.3 Fail	2.1 Fail
2.2 Fail	1.7 Fail	1.3 Fail	—	1.6 Fail
3.5 AA Large	2.7 Fail	2.1 Fail	1.6 Fail	—

White BG

1.4Fail

1.7Fail

2.3Fail

3.0Fail

4.7AA

Black BG

15.5AAA

12.2AAA

9.1AAA

7.1AAA

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDB8

D0D0A4

C4C47F

AEAD80

7C7C6D

Deuteranopia

DCDBBB

D2D3A6

C9CF81

B3B980

7D7F6D

Tritanopia

D9C3C5

DAABAD

E28587

CD8080

866D6D

Achromatopsia

D9D9D9

C5C5C5

ACACAC

989898

757575

Shades & Tints Shades & Tints

#D8E3AA

Dark

Light

#DBC29A

Dark

Light

#E69877

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e3aa;
  --color-2: #dbc29a;
  --color-3: #e69877;
  --color-4: #d18080;
  --color-5: #876d6d;
}

SCSS

$color-1: #d8e3aa;
$color-2: #dbc29a;
$color-3: #e69877;
$color-4: #d18080;
$color-5: #876d6d;

TAILWIND

colors: {
  'brand-1': '#d8e3aa',
  'brand-2': '#dbc29a',
  'brand-3': '#e69877',
  'brand-4': '#d18080',
  'brand-5': '#876d6d',
}

RGB Array

[216, 227, 170], [219, 194, 154], [230, 152, 119], [209, 128, 128], [135, 109, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8E3AA, #DBC29A, #E69877, #D18080, #876D6D 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: #d8e3aa; --color-2: #dbc29a; --color-3: #e69877; --color-4: #d18080; --color-5: #876d6d. 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