← Back to Editor

#8E9E94 · #8BC8C4 · #D6DEBE · #F5F6EC · #DFE6E1

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#8E9E94

Celadon · DarkSeaGreen · Silver Sand

HEX
#8E9E94
RGB
rgb(142, 158, 148)
HSL
hsl(143, 8%, 59%)
HSB
hsb(143, 10%, 62%)
CMYK
cmyk(10%, 0%, 6%, 38%)
Oklch
oklch(68.4% 0.023 158.3)

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

#8BC8C4

Jade · SkyBlue · Lake Green

HEX
#8BC8C4
RGB
rgb(139, 200, 196)
HSL
hsl(176, 36%, 66%)
HSB
hsb(176, 31%, 78%)
CMYK
cmyk(31%, 0%, 2%, 22%)
Oklch
oklch(79.0% 0.063 190.8)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#D6DEBE

Willow Green · LightGray · Mint Green

HEX
#D6DEBE
RGB
rgb(214, 222, 190)
HSL
hsl(75, 33%, 81%)
HSB
hsb(75, 14%, 87%)
CMYK
cmyk(4%, 0%, 14%, 13%)
Oklch
oklch(88.6% 0.044 118.7)

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

#F5F6EC

Fresh Green · Linen · Lemon Cream

HEX
#F5F6EC
RGB
rgb(245, 246, 236)
HSL
hsl(66, 36%, 95%)
HSB
hsb(66, 4%, 96%)
CMYK
cmyk(0%, 0%, 4%, 4%)
Oklch
oklch(97.0% 0.013 111.3)

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

#DFE6E1

Celadon · Lavender · Mint Green

HEX
#DFE6E1
RGB
rgb(223, 230, 225)
HSL
hsl(137, 12%, 89%)
HSB
hsb(137, 3%, 90%)
CMYK
cmyk(3%, 0%, 2%, 10%)
Oklch
oklch(91.8% 0.010 155.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8E9E94
9F8E98

Analogous

909F8E
8E9E94
8E9F9D

Triadic

8E9E94
948E9F
9F948E

Split-Comp.

8E9E94
9D8E9F
9F8E90

Tetradic

8E9E94
8E909F
9F8E98
9F9D8E

Contrast Matrix WCAG 2.1 Contrast

8E9E94
8BC8C4
D6DEBE
F5F6EC
DFE6E1
—
1.5
Fail
2.0
Fail
2.6
Fail
2.2
Fail
1.5
Fail
—
1.3
Fail
1.7
Fail
1.5
Fail
2.0
Fail
1.3
Fail
—
1.3
Fail
1.1
Fail
2.6
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.2
Fail
1.5
Fail
1.1
Fail
1.2
Fail
—
White BG
2.8Fail
1.9Fail
1.4Fail
1.1Fail
1.3Fail
Black BG
7.5AAA
11.2AAA
15.1AAA
19.3AAA
16.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

959596
A5A6C5
D9DAC6
F5F5EE
E2E2E2

Deuteranopia

949397
A29DC5
D9D8C8
F5F5EF
E2E1E3

Tritanopia

8F9899
8EC6C6
D6CCCD
F5F0F1
DFE3E3

Achromatopsia

989898
B5B5B5
D8D8D8
F5F5F5
E3E3E3

Shades & Tints Shades & Tints

#8E9E94

Dark
Light

#8BC8C4

Dark
Light

#D6DEBE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8e9e94;
  --color-2: #8bc8c4;
  --color-3: #d6debe;
  --color-4: #f5f6ec;
  --color-5: #dfe6e1;
}

SCSS

$color-1: #8e9e94;
$color-2: #8bc8c4;
$color-3: #d6debe;
$color-4: #f5f6ec;
$color-5: #dfe6e1;

TAILWIND

colors: {
  'brand-1': '#8e9e94',
  'brand-2': '#8bc8c4',
  'brand-3': '#d6debe',
  'brand-4': '#f5f6ec',
  'brand-5': '#dfe6e1',
}

RGB Array

[142, 158, 148], [139, 200, 196], [214, 222, 190], [245, 246, 236], [223, 230, 225]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #8E9E94, #8BC8C4, #D6DEBE, #F5F6EC, #DFE6E1 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: #8e9e94; --color-2: #8bc8c4; --color-3: #d6debe; --color-4: #f5f6ec; --color-5: #dfe6e1. 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 nature-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