← Back to Editor

#D2D5A2 · #A0CBA6 · #70AFA5 · #7A9896 · #838584

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

#D2D5A2

Fresh Green · Tan · Sunflower

HEX
#D2D5A2
RGB
rgb(210, 213, 162)
HSL
hsl(64, 38%, 74%)
HSB
hsb(64, 24%, 84%)
CMYK
cmyk(1%, 0%, 24%, 16%)
Oklch
oklch(85.8% 0.067 110.5)

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

#A0CBA6

Celadon · DarkSeaGreen · Apple Green

HEX
#A0CBA6
RGB
rgb(160, 203, 166)
HSL
hsl(128, 29%, 71%)
HSB
hsb(128, 21%, 80%)
CMYK
cmyk(21%, 0%, 18%, 20%)
Oklch
oklch(80.1% 0.069 148.7)

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

#70AFA5

Mineral Blue · CadetBlue · Lake Green

HEX
#70AFA5
RGB
rgb(112, 175, 165)
HSL
hsl(170, 28%, 56%)
HSB
hsb(170, 36%, 69%)
CMYK
cmyk(36%, 0%, 6%, 31%)
Oklch
oklch(70.8% 0.067 183.3)

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

#7A9896

Mineral Blue · LightSlateGray · Lake Green

HEX
#7A9896
RGB
rgb(122, 152, 150)
HSL
hsl(176, 13%, 54%)
HSB
hsb(176, 20%, 60%)
CMYK
cmyk(20%, 0%, 1%, 40%)
Oklch
oklch(65.6% 0.034 191.3)

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

#838584

Ash · Gray · Warm Gray

HEX
#838584
RGB
rgb(131, 133, 132)
HSL
hsl(150, 1%, 52%)
HSB
hsb(150, 2%, 52%)
CMYK
cmyk(2%, 0%, 1%, 48%)
Oklch
oklch(61.5% 0.003 165.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2D5A2
A7A4D6

Analogous

D6C0A4
D2D5A2
B9D6A4

Triadic

D2D5A2
A4D3D6
D6A4D3

Split-Comp.

D2D5A2
A4B9D6
C0A4D6

Tetradic

D2D5A2
A4D6C0
A7A4D6
D6A4B9

Contrast Matrix WCAG 2.1 Contrast

D2D5A2
A0CBA6
70AFA5
7A9896
838584
—
1.2
Fail
1.6
Fail
2.0
Fail
2.4
Fail
1.2
Fail
—
1.4
Fail
1.7
Fail
2.0
Fail
1.6
Fail
1.4
Fail
—
1.2
Fail
1.5
Fail
2.0
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
2.4
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
White BG
1.5Fail
1.8Fail
2.5Fail
3.1AA Large
3.7AA Large
Black BG
13.8AAA
11.6AAA
8.4AAA
6.8AA
5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3AE
B3B3AF
8B8CA7
878796
848484

Deuteranopia

D3D3B1
B0ADB1
8883A8
858397
848484

Tritanopia

D2B8BA
A2B6B8
73A9AA
7B9797
838484

Achromatopsia

CECECE
BABABA
9B9B9B
8F8F8F
848484

Shades & Tints Shades & Tints

#D2D5A2

Dark
Light

#A0CBA6

Dark
Light

#70AFA5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2d5a2;
  --color-2: #a0cba6;
  --color-3: #70afa5;
  --color-4: #7a9896;
  --color-5: #838584;
}

SCSS

$color-1: #d2d5a2;
$color-2: #a0cba6;
$color-3: #70afa5;
$color-4: #7a9896;
$color-5: #838584;

TAILWIND

colors: {
  'brand-1': '#d2d5a2',
  'brand-2': '#a0cba6',
  'brand-3': '#70afa5',
  'brand-4': '#7a9896',
  'brand-5': '#838584',
}

RGB Array

[210, 213, 162], [160, 203, 166], [112, 175, 165], [122, 152, 150], [131, 133, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #D2D5A2, #A0CBA6, #70AFA5, #7A9896, #838584 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: #d2d5a2; --color-2: #a0cba6; --color-3: #70afa5; --color-4: #7a9896; --color-5: #838584. 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