#E5EFD6 + #DCDDB1 + #D3D69F + #CBC686 + #B8C5AB · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#E5EFD6

Willow Green · Beige · Mint Green

HEX

#E5EFD6

RGB

rgb(229, 239, 214)

HSL

hsl(84, 44%, 89%)

HSB

hsb(84, 10%, 94%)

CMYK

cmyk(4%, 0%, 10%, 6%)

Oklch

oklch(93.8% 0.035 124.9)

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

#DCDDB1

Fresh Green · Wheat · Lemon Cream

HEX

#DCDDB1

RGB

rgb(220, 221, 177)

HSL

hsl(61, 39%, 78%)

HSB

hsb(61, 20%, 87%)

CMYK

cmyk(0%, 0%, 20%, 13%)

Oklch

oklch(88.6% 0.058 108.6)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#D3D69F

Fresh Green · Khaki · Sunflower

HEX

#D3D69F

RGB

rgb(211, 214, 159)

HSL

hsl(63, 40%, 73%)

HSB

hsb(63, 26%, 84%)

CMYK

cmyk(1%, 0%, 26%, 16%)

Oklch

oklch(86.0% 0.072 110.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#CBC686

Fresh Green · Tan · Sunflower

HEX

#CBC686

RGB

rgb(203, 198, 134)

HSL

hsl(56, 40%, 66%)

HSB

hsb(56, 34%, 80%)

CMYK

cmyk(0%, 2%, 34%, 20%)

Oklch

oklch(81.6% 0.084 104.3)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#B8C5AB

Celadon · Silver · Apple Green

HEX

#B8C5AB

RGB

rgb(184, 197, 171)

HSL

hsl(90, 18%, 72%)

HSB

hsb(90, 13%, 77%)

CMYK

cmyk(7%, 0%, 13%, 23%)

Oklch

oklch(80.6% 0.038 129.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E5EFD6

E0D7EF

Analogous

EFEDD7

E5EFD6

D9EFD7

Triadic

E5EFD6

D7E5EF

EFD7E5

Split-Comp.

E5EFD6

D7D9EF

EDD7EF

Tetradic

E5EFD6

D7EFED

E0D7EF

EFD7D9

Contrast Matrix WCAG 2.1 Contrast

E5EFD6	DCDDB1	D3D69F	CBC686	B8C5AB
—	1.2 Fail	1.3 Fail	1.5 Fail	1.5 Fail
1.2 Fail	—	1.1 Fail	1.3 Fail	1.3 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.2 Fail
1.5 Fail	1.3 Fail	1.2 Fail	—	1.0 Fail
1.5 Fail	1.3 Fail	1.2 Fail	1.0 Fail	—

White BG

1.2Fail

1.4Fail

1.5Fail

1.8Fail

Black BG

17.6AAA

15.0AAA

13.9AAA

12.0AAA

11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9DC

DCDCBC

D4D4AC

C9C995

BEBEB1

Deuteranopia

E9E8DE

DCDCBE

D4D4B0

C9CA99

BDBCB3

Tritanopia

E5E1E2

DCC4C6

D3B7B9

CBA2A4

B9B6B7

Achromatopsia

E9E9E9

D8D8D8

CFCFCF

C0C0C0

BEBEBE

Shades & Tints Shades & Tints

#E5EFD6

Dark

Light

#DCDDB1

Dark

Light

#D3D69F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e5efd6;
  --color-2: #dcddb1;
  --color-3: #d3d69f;
  --color-4: #cbc686;
  --color-5: #b8c5ab;
}

SCSS

$color-1: #e5efd6;
$color-2: #dcddb1;
$color-3: #d3d69f;
$color-4: #cbc686;
$color-5: #b8c5ab;

TAILWIND

colors: {
  'brand-1': '#e5efd6',
  'brand-2': '#dcddb1',
  'brand-3': '#d3d69f',
  'brand-4': '#cbc686',
  'brand-5': '#b8c5ab',
}

RGB Array

[229, 239, 214], [220, 221, 177], [211, 214, 159], [203, 198, 134], [184, 197, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #E5EFD6, #DCDDB1, #D3D69F, #CBC686, #B8C5AB 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: #e5efd6; --color-2: #dcddb1; --color-3: #d3d69f; --color-4: #cbc686; --color-5: #b8c5ab. 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 pastel-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