← Back to Editor

#D7E2E6 · #DEE3CC · #D6DEB5 · #AFB6A6 · #C7D588

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D7E2E6

Sky Blue · LightGray · Glacier Blue

HEX
#D7E2E6
RGB
rgb(215, 226, 230)
HSL
hsl(196, 23%, 87%)
HSB
hsb(196, 7%, 90%)
CMYK
cmyk(7%, 2%, 0%, 10%)
Oklch
oklch(90.6% 0.013 221.4)

TraditionalSky Blue」· PaintGlacier Blue」· Creative Arctic Pool

#DEE3CC

Willow Green · LightGray · Mint Green

HEX
#DEE3CC
RGB
rgb(222, 227, 204)
HSL
hsl(73, 29%, 85%)
HSB
hsb(73, 10%, 89%)
CMYK
cmyk(2%, 0%, 10%, 11%)
Oklch
oklch(90.6% 0.031 117.0)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

#D6DEB5

Willow Green · Wheat · Apple Green

HEX
#D6DEB5
RGB
rgb(214, 222, 181)
HSL
hsl(72, 38%, 79%)
HSB
hsb(72, 18%, 87%)
CMYK
cmyk(4%, 0%, 18%, 13%)
Oklch
oklch(88.4% 0.055 116.5)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#AFB6A6

Willow Green · DarkGray · Apple Green

HEX
#AFB6A6
RGB
rgb(175, 182, 166)
HSL
hsl(86, 10%, 68%)
HSB
hsb(86, 9%, 71%)
CMYK
cmyk(4%, 0%, 9%, 29%)
Oklch
oklch(76.6% 0.024 126.3)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#C7D588

Willow Green · Tan · Apple Green

HEX
#C7D588
RGB
rgb(199, 213, 136)
HSL
hsl(71, 48%, 68%)
HSB
hsb(71, 36%, 84%)
CMYK
cmyk(7%, 0%, 36%, 16%)
Oklch
oklch(84.5% 0.101 117.0)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7E2E6
E5DAD6

Analogous

D6E5E2
D7E2E6
D6DAE5

Triadic

D7E2E6
E5D6E1
E1E5D6

Split-Comp.

D7E2E6
E5D6DA
E5E2D6

Tetradic

D7E2E6
E2D6E5
E5DAD6
DAE5D6

Contrast Matrix WCAG 2.1 Contrast

D7E2E6
DEE3CC
D6DEB5
AFB6A6
C7D588
1.0
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.0
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.5
Fail
1.1
Fail
1.6
Fail
1.6
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.3
Fail
White BG
1.3Fail
1.3Fail
1.4Fail
2.1Fail
1.6Fail
Black BG
15.9AAA
16.0AAA
15.0AAA
10.1AAA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCE5
E0E0D2
D9DABF
B2B2AA
CDCD9B

Deuteranopia

DBDAE5
E0DFD3
D9D8C1
B2B1AB
CCCB9F

Tritanopia

D8E4E4
DED6D7
D6C7C8
AFADAE
C8A9AD

Achromatopsia

DFDFDF
DFDFDF
D7D7D7
B2B2B2
C8C8C8

Shades & Tints Shades & Tints

#D7E2E6

Dark
Light

#DEE3CC

Dark
Light

#D6DEB5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7e2e6;
  --color-2: #dee3cc;
  --color-3: #d6deb5;
  --color-4: #afb6a6;
  --color-5: #c7d588;
}

SCSS

$color-1: #d7e2e6;
$color-2: #dee3cc;
$color-3: #d6deb5;
$color-4: #afb6a6;
$color-5: #c7d588;

TAILWIND

colors: {
  'brand-1': '#d7e2e6',
  'brand-2': '#dee3cc',
  'brand-3': '#d6deb5',
  'brand-4': '#afb6a6',
  'brand-5': '#c7d588',
}

RGB Array

[215, 226, 230], [222, 227, 204], [214, 222, 181], [175, 182, 166], [199, 213, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #D7E2E6, #DEE3CC, #D6DEB5, #AFB6A6, #C7D588 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. 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: #d7e2e6; --color-2: #dee3cc; --color-3: #d6deb5; --color-4: #afb6a6; --color-5: #c7d588. 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 beauty, lifestyle, arts 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