#DDE0D6 + #B6CBE6 + #AECCA0 + #C1B674 + #E9822E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DDE0D6

Willow Green · LightGray · Mint Green

HEX

#DDE0D6

RGB

rgb(221, 224, 214)

HSL

hsl(78, 14%, 86%)

HSB

hsb(78, 4%, 88%)

CMYK

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

Oklch

oklch(90.2% 0.014 120.3)

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

#B6CBE6

Azure · LightSteelBlue · Sky Blue

HEX

#B6CBE6

RGB

rgb(182, 203, 230)

HSL

hsl(214, 49%, 81%)

HSB

hsb(214, 21%, 90%)

CMYK

cmyk(21%, 12%, 0%, 10%)

Oklch

oklch(83.5% 0.044 254.8)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#AECCA0

Celadon · DarkGray · Apple Green

HEX

#AECCA0

RGB

rgb(174, 204, 160)

HSL

hsl(101, 30%, 71%)

HSB

hsb(101, 22%, 80%)

CMYK

cmyk(15%, 0%, 22%, 20%)

Oklch

oklch(81.1% 0.068 135.8)

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

#C1B674

Fresh Green · Tan · Sunflower

HEX

#C1B674

RGB

rgb(193, 182, 116)

HSL

hsl(51, 38%, 61%)

HSB

hsb(51, 40%, 76%)

CMYK

cmyk(0%, 6%, 40%, 24%)

Oklch

oklch(77.0% 0.087 100.0)

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

#E9822E

Tangerine · Chocolate · Warm Sun

HEX

#E9822E

RGB

rgb(233, 130, 46)

HSL

hsl(27, 81%, 55%)

HSB

hsb(27, 80%, 91%)

CMYK

cmyk(0%, 44%, 80%, 9%)

Oklch

oklch(70.7% 0.156 54.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDE0D6

D9D6E0

Analogous

E0DED6

DDE0D6

D8E0D6

Triadic

DDE0D6

D6DDE0

E0D6DD

Split-Comp.

DDE0D6

D6D8E0

DED6E0

Tetradic

DDE0D6

D6E0DE

D9D6E0

E0D6D8

Contrast Matrix WCAG 2.1 Contrast

DDE0D6	B6CBE6	AECCA0	C1B674	E9822E
—	1.2 Fail	1.3 Fail	1.5 Fail	2.0 Fail
1.2 Fail	—	1.1 Fail	1.2 Fail	1.6 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.6 Fail
1.5 Fail	1.2 Fail	1.2 Fail	—	1.3 Fail
2.0 Fail	1.6 Fail	1.6 Fail	1.3 Fail	—

White BG

1.3Fail

1.7Fail

1.8Fail

2.1Fail

2.7Fail

Black BG

15.7AAA

12.7AAA

11.9AAA

10.2AAA

7.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDED8

BFBFDF

BBBBAB

BCBC84

BCBB42

Deuteranopia

DEDED9

BEBCDE

B9B7AD

BDBE88

C2CA47

Tritanopia

DDDADB

B7DAD9

AFB3B5

C09193

E45256

Achromatopsia

DEDEDE

C8C8C8

BEBEBE

B2B2B2

979797

Shades & Tints Shades & Tints

#DDE0D6

Dark

Light

#B6CBE6

Dark

Light

#AECCA0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dde0d6;
  --color-2: #b6cbe6;
  --color-3: #aecca0;
  --color-4: #c1b674;
  --color-5: #e9822e;
}

SCSS

$color-1: #dde0d6;
$color-2: #b6cbe6;
$color-3: #aecca0;
$color-4: #c1b674;
$color-5: #e9822e;

TAILWIND

colors: {
  'brand-1': '#dde0d6',
  'brand-2': '#b6cbe6',
  'brand-3': '#aecca0',
  'brand-4': '#c1b674',
  'brand-5': '#e9822e',
}

RGB Array

[221, 224, 214], [182, 203, 230], [174, 204, 160], [193, 182, 116], [233, 130, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DDE0D6, #B6CBE6, #AECCA0, #C1B674, #E9822E 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: #dde0d6; --color-2: #b6cbe6; --color-3: #aecca0; --color-4: #c1b674; --color-5: #e9822e. 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