← Back to Editor

#DDE0BD · #D0D1AC · #B6AA85 · #948B89 · #726E75

earth

A 5-color earth palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DDE0BD

Fresh Green · Wheat · Lemon Cream

HEX
#DDE0BD
RGB
rgb(221, 224, 189)
HSL
hsl(65, 36%, 81%)
HSB
hsb(65, 16%, 88%)
CMYK
cmyk(1%, 0%, 16%, 12%)
Oklch
oklch(89.5% 0.047 111.3)

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

#D0D1AC

Fresh Green · Silver · Sunflower

HEX
#D0D1AC
RGB
rgb(208, 209, 172)
HSL
hsl(62, 29%, 75%)
HSB
hsb(62, 18%, 82%)
CMYK
cmyk(0%, 0%, 18%, 18%)
Oklch
oklch(85.0% 0.050 108.7)

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

#B6AA85

Ginger · Tan · Sunflower

HEX
#B6AA85
RGB
rgb(182, 170, 133)
HSL
hsl(45, 25%, 62%)
HSB
hsb(45, 27%, 71%)
CMYK
cmyk(0%, 7%, 27%, 29%)
Oklch
oklch(73.9% 0.052 92.2)

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

#948B89

Ash · Gray · Silver Sand

HEX
#948B89
RGB
rgb(148, 139, 137)
HSL
hsl(11, 5%, 56%)
HSB
hsb(11, 7%, 58%)
CMYK
cmyk(0%, 6%, 7%, 42%)
Oklch
oklch(64.4% 0.011 32.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#726E75

Ink Gray · DimGray · Warm Gray

HEX
#726E75
RGB
rgb(114, 110, 117)
HSL
hsl(274, 3%, 45%)
HSB
hsb(274, 6%, 46%)
CMYK
cmyk(3%, 6%, 0%, 54%)
Oklch
oklch(54.4% 0.012 311.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDE0BD
C0BDE0

Analogous

E0D1BD
DDE0BD
CCE0BD

Triadic

DDE0BD
BDDDE0
E0BDDD

Split-Comp.

DDE0BD
BDCCE0
D1BDE0

Tetradic

DDE0BD
BDE0D1
C0BDE0
E0BDCC

Contrast Matrix WCAG 2.1 Contrast

DDE0BD
D0D1AC
B6AA85
948B89
726E75
—
1.2
Fail
1.7
Fail
2.5
Fail
3.7
AA Large
1.2
Fail
—
1.5
Fail
2.1
Fail
3.2
AA Large
1.7
Fail
1.5
Fail
—
1.4
Fail
2.2
Fail
2.5
Fail
2.1
Fail
1.4
Fail
—
1.5
Fail
3.7
AA Large
3.2
AA Large
2.2
Fail
1.5
Fail
—
White BG
1.4Fail
1.6Fail
2.3Fail
3.3AA Large
5.0AA
Black BG
15.5AAA
13.4AAA
9.1AAA
6.3AA
4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEC5
D0D0B5
B1B18E
909089
707073

Deuteranopia

DEDEC8
D0D0B7
B2B290
91918A
717173

Tritanopia

DDCCCE
D0BCBE
B59597
948A8A
727272

Achromatopsia

DBDBDB
CCCCCC
A9A9A9
8D8D8D
707070

Shades & Tints Shades & Tints

#DDE0BD

Dark
Light

#D0D1AC

Dark
Light

#B6AA85

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dde0bd;
  --color-2: #d0d1ac;
  --color-3: #b6aa85;
  --color-4: #948b89;
  --color-5: #726e75;
}

SCSS

$color-1: #dde0bd;
$color-2: #d0d1ac;
$color-3: #b6aa85;
$color-4: #948b89;
$color-5: #726e75;

TAILWIND

colors: {
  'brand-1': '#dde0bd',
  'brand-2': '#d0d1ac',
  'brand-3': '#b6aa85',
  'brand-4': '#948b89',
  'brand-5': '#726e75',
}

RGB Array

[221, 224, 189], [208, 209, 172], [182, 170, 133], [148, 139, 137], [114, 110, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #DDE0BD, #D0D1AC, #B6AA85, #948B89, #726E75 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #dde0bd; --color-2: #d0d1ac; --color-3: #b6aa85; --color-4: #948b89; --color-5: #726e75. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. Restrained colors convey professionalism and trust. 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