← Back to Editor

#9CA66C · #80995C · #A7BF8F · #AACCA3 · #D6E5CF

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGrounded

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#9CA66C

Grass Green · DarkSeaGreen · Olive Green

HEX
#9CA66C
RGB
rgb(156, 166, 108)
HSL
hsl(70, 25%, 54%)
HSB
hsb(70, 35%, 65%)
CMYK
cmyk(6%, 0%, 35%, 35%)
Oklch
oklch(70.3% 0.080 116.5)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#80995C

Grass Green · Gray · Olive Green

HEX
#80995C
RGB
rgb(128, 153, 92)
HSL
hsl(85, 25%, 48%)
HSB
hsb(85, 40%, 60%)
CMYK
cmyk(16%, 0%, 40%, 40%)
Oklch
oklch(64.8% 0.090 126.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#A7BF8F

Celadon · DarkSeaGreen · Apple Green

HEX
#A7BF8F
RGB
rgb(167, 191, 143)
HSL
hsl(90, 27%, 65%)
HSB
hsb(90, 25%, 75%)
CMYK
cmyk(13%, 0%, 25%, 25%)
Oklch
oklch(77.4% 0.071 129.5)

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

#AACCA3

Celadon · DarkGray · Apple Green

HEX
#AACCA3
RGB
rgb(170, 204, 163)
HSL
hsl(110, 29%, 72%)
HSB
hsb(110, 20%, 80%)
CMYK
cmyk(17%, 0%, 20%, 20%)
Oklch
oklch(80.9% 0.067 140.3)

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

#D6E5CF

Celadon · LightGray · Mint Green

HEX
#D6E5CF
RGB
rgb(214, 229, 207)
HSL
hsl(101, 30%, 85%)
HSB
hsb(101, 10%, 90%)
CMYK
cmyk(7%, 0%, 10%, 10%)
Oklch
oklch(90.5% 0.034 135.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9CA66C
766CA7

Analogous

A7936C
9CA66C
80A76C

Triadic

9CA66C
6C9DA7
A76C9D

Split-Comp.

9CA66C
6C80A7
936CA7

Tetradic

9CA66C
6CA793
766CA7
A76C80

Contrast Matrix WCAG 2.1 Contrast

9CA66C
80995C
A7BF8F
AACCA3
D6E5CF
—
1.2
Fail
1.3
Fail
1.5
Fail
2.0
Fail
1.2
Fail
—
1.6
Fail
1.8
Fail
2.4
Fail
1.3
Fail
1.6
Fail
—
1.1
Fail
1.5
Fail
1.5
Fail
1.8
Fail
1.1
Fail
—
1.3
Fail
2.0
Fail
2.4
Fail
1.5
Fail
1.3
Fail
—
White BG
2.6Fail
3.2AA Large
2.0Fail
1.8Fail
1.3Fail
Black BG
8.1AAA
6.6AA
10.5AAA
11.9AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A07A
8B8B6B
B1B29B
B9B9AD
DCDDD4

Deuteranopia

A09F7D
89886E
B0AE9D
B7B4AF
DCDBD6

Tritanopia

9D8588
817679
A8A4A6
ACB5B6
D7D9D9

Achromatopsia

9C9C9C
8B8B8B
B2B2B2
BDBDBD
DEDEDE

Shades & Tints Shades & Tints

#9CA66C

Dark
Light

#80995C

Dark
Light

#A7BF8F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9ca66c;
  --color-2: #80995c;
  --color-3: #a7bf8f;
  --color-4: #aacca3;
  --color-5: #d6e5cf;
}

SCSS

$color-1: #9ca66c;
$color-2: #80995c;
$color-3: #a7bf8f;
$color-4: #aacca3;
$color-5: #d6e5cf;

TAILWIND

colors: {
  'brand-1': '#9ca66c',
  'brand-2': '#80995c',
  'brand-3': '#a7bf8f',
  'brand-4': '#aacca3',
  'brand-5': '#d6e5cf',
}

RGB Array

[156, 166, 108], [128, 153, 92], [167, 191, 143], [170, 204, 163], [214, 229, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #9CA66C, #80995C, #A7BF8F, #AACCA3, #D6E5CF 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: #9ca66c; --color-2: #80995c; --color-3: #a7bf8f; --color-4: #aacca3; --color-5: #d6e5cf. 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 nature-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