#DED1B8 + #E7ECDC + #B0D9CD + #7FB5B3 + #6B9E9D · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DED1B8

Goose Yellow · Wheat · Peach Orange

HEX

#DED1B8

RGB

rgb(222, 209, 184)

HSL

hsl(39, 37%, 80%)

HSB

hsb(39, 17%, 87%)

CMYK

cmyk(0%, 6%, 17%, 13%)

Oklch

oklch(86.5% 0.037 83.8)

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

#E7ECDC

Willow Green · Beige · Mint Green

HEX

#E7ECDC

RGB

rgb(231, 236, 220)

HSL

hsl(79, 30%, 89%)

HSB

hsb(79, 7%, 93%)

CMYK

cmyk(2%, 0%, 7%, 7%)

Oklch

oklch(93.5% 0.022 121.0)

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

#B0D9CD

Jade · LightBlue · Glacier Blue

HEX

#B0D9CD

RGB

rgb(176, 217, 205)

HSL

hsl(162, 35%, 77%)

HSB

hsb(162, 19%, 85%)

CMYK

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

Oklch

oklch(85.3% 0.046 175.4)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#7FB5B3

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#7FB5B3

RGB

rgb(127, 181, 179)

HSL

hsl(178, 27%, 60%)

HSB

hsb(178, 30%, 71%)

CMYK

cmyk(30%, 0%, 1%, 29%)

Oklch

oklch(73.5% 0.057 193.1)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#6B9E9D

Mineral Blue · CadetBlue · Lake Green

HEX

#6B9E9D

RGB

rgb(107, 158, 157)

HSL

hsl(179, 21%, 52%)

HSB

hsb(179, 32%, 62%)

CMYK

cmyk(32%, 0%, 1%, 38%)

Oklch

oklch(66.3% 0.054 194.4)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DED1B8

B9C6DF

Analogous

DFBFB9

DED1B8

D9DFB9

Triadic

DED1B8

B9DFD2

D2B9DF

Split-Comp.

DED1B8

B9D9DF

BFB9DF

Tetradic

DED1B8

B9DFBF

B9C6DF

DFB9D9

Contrast Matrix WCAG 2.1 Contrast

DED1B8	E7ECDC	B0D9CD	7FB5B3	6B9E9D
—	1.3 Fail	1.0 Fail	1.5 Fail	2.0 Fail
1.3 Fail	—	1.3 Fail	1.9 Fail	2.5 Fail
1.0 Fail	1.3 Fail	—	1.5 Fail	1.9 Fail
1.5 Fail	1.9 Fail	1.5 Fail	—	1.3 Fail
2.0 Fail	2.5 Fail	1.9 Fail	1.3 Fail	—

White BG

1.5Fail

1.2Fail

1.5Fail

2.3Fail

3.0Fail

Black BG

13.9AAA

17.4AAA

13.7AAA

9.2AAA

7.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D8BE

E9E9E0

C2C2D0

9697B3

81829D

Deuteranopia

D9DABF

E9E9E1

BFBCD1

938FB4

7E7A9D

Tritanopia

DDC3C4

E7E3E4

B2D2D3

82B4B4

6E9D9D

Achromatopsia

D2D2D2

E9E9E9

CBCBCB

A5A5A5

8F8F8F

Shades & Tints Shades & Tints

#DED1B8

Dark

Light

#E7ECDC

Dark

Light

#B0D9CD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ded1b8;
  --color-2: #e7ecdc;
  --color-3: #b0d9cd;
  --color-4: #7fb5b3;
  --color-5: #6b9e9d;
}

SCSS

$color-1: #ded1b8;
$color-2: #e7ecdc;
$color-3: #b0d9cd;
$color-4: #7fb5b3;
$color-5: #6b9e9d;

TAILWIND

colors: {
  'brand-1': '#ded1b8',
  'brand-2': '#e7ecdc',
  'brand-3': '#b0d9cd',
  'brand-4': '#7fb5b3',
  'brand-5': '#6b9e9d',
}

RGB Array

[222, 209, 184], [231, 236, 220], [176, 217, 205], [127, 181, 179], [107, 158, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #DED1B8, #E7ECDC, #B0D9CD, #7FB5B3, #6B9E9D 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: #ded1b8; --color-2: #e7ecdc; --color-3: #b0d9cd; --color-4: #7fb5b3; --color-5: #6b9e9d. 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 earth-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