#D3EBB7 + #A5CCA5 + #8E897E + #B8AD95 + #DEC1A0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D3EBB7

Willow Green · Wheat · Mint Green

HEX

#D3EBB7

RGB

rgb(211, 235, 183)

HSL

hsl(88, 57%, 82%)

HSB

hsb(88, 22%, 92%)

CMYK

cmyk(10%, 0%, 22%, 8%)

Oklch

oklch(90.9% 0.073 127.9)

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

#A5CCA5

Celadon · DarkSeaGreen · Apple Green

HEX

#A5CCA5

RGB

rgb(165, 204, 165)

HSL

hsl(120, 28%, 72%)

HSB

hsb(120, 19%, 80%)

CMYK

cmyk(19%, 0%, 19%, 20%)

Oklch

oklch(80.6% 0.068 144.9)

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

#8E897E

Ash · Gray · Warm Gray

HEX

#8E897E

RGB

rgb(142, 137, 126)

HSL

hsl(41, 7%, 53%)

HSB

hsb(41, 11%, 56%)

CMYK

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

Oklch

oklch(63.1% 0.017 86.5)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#B8AD95

Ginger · DarkGray · Sunflower

HEX

#B8AD95

RGB

rgb(184, 173, 149)

HSL

hsl(41, 20%, 65%)

HSB

hsb(41, 19%, 72%)

CMYK

cmyk(0%, 6%, 19%, 28%)

Oklch

oklch(75.0% 0.036 86.3)

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

#DEC1A0

Goose Yellow · BurlyWood · Warm Sun

HEX

#DEC1A0

RGB

rgb(222, 193, 160)

HSL

hsl(32, 48%, 75%)

HSB

hsb(32, 28%, 87%)

CMYK

cmyk(0%, 13%, 28%, 13%)

Oklch

oklch(82.7% 0.055 70.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3EBB7

CFB7EB

Analogous

EBEAB7

D3EBB7

B9EBB7

Triadic

D3EBB7

B7D3EB

EBB7D3

Split-Comp.

D3EBB7

B7B9EB

EAB7EB

Tetradic

D3EBB7

B7EBEA

CFB7EB

EBB7B9

Contrast Matrix WCAG 2.1 Contrast

D3EBB7	A5CCA5	8E897E	B8AD95	DEC1A0
—	1.4 Fail	2.7 Fail	1.7 Fail	1.3 Fail
1.4 Fail	—	2.0 Fail	1.2 Fail	1.0 Fail
2.7 Fail	2.0 Fail	—	1.6 Fail	2.0 Fail
1.7 Fail	1.2 Fail	1.6 Fail	—	1.3 Fail
1.3 Fail	1.0 Fail	2.0 Fail	1.3 Fail	—

White BG

1.3Fail

1.8Fail

3.5AA Large

2.2Fail

1.7Fail

Black BG

16.3AAA

11.8AAA

6.0AA

9.4AAA

12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDEC4

B6B6AE

8C8C81

B3B39B

D1D1A8

Deuteranopia

DCDAC7

B4B1B1

8C8D81

B4B59C

D3D5AA

Tritanopia

D4CED0

A7B6B8

8E8383

B79FA0

DDAEB0

Achromatopsia

DEDEDE

BCBCBC

898989

AEAEAE

C6C6C6

Shades & Tints Shades & Tints

#D3EBB7

Dark

Light

#A5CCA5

Dark

Light

#8E897E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3ebb7;
  --color-2: #a5cca5;
  --color-3: #8e897e;
  --color-4: #b8ad95;
  --color-5: #dec1a0;
}

SCSS

$color-1: #d3ebb7;
$color-2: #a5cca5;
$color-3: #8e897e;
$color-4: #b8ad95;
$color-5: #dec1a0;

TAILWIND

colors: {
  'brand-1': '#d3ebb7',
  'brand-2': '#a5cca5',
  'brand-3': '#8e897e',
  'brand-4': '#b8ad95',
  'brand-5': '#dec1a0',
}

RGB Array

[211, 235, 183], [165, 204, 165], [142, 137, 126], [184, 173, 149], [222, 193, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3EBB7, #A5CCA5, #8E897E, #B8AD95, #DEC1A0 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: #d3ebb7; --color-2: #a5cca5; --color-3: #8e897e; --color-4: #b8ad95; --color-5: #dec1a0. 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