← Back to Editor

#3D4035 · #6B8029 · #85915E · #ABB392 · #D7DEBF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#3D4035

Grass Green · DarkSlateGray · Dark Stone

HEX
#3D4035
RGB
rgb(61, 64, 53)
HSL
hsl(76, 9%, 23%)
HSB
hsb(76, 17%, 25%)
CMYK
cmyk(5%, 0%, 17%, 75%)
Oklch
oklch(36.5% 0.019 119.7)

Traditional「Grass Green」· Paint「Dark Stone」· Creative Midnight Shadow

#6B8029

Grass Green · DarkOliveGreen · Forest Green

HEX
#6B8029
RGB
rgb(107, 128, 41)
HSL
hsl(74, 51%, 33%)
HSB
hsb(74, 68%, 50%)
CMYK
cmyk(16%, 0%, 68%, 50%)
Oklch
oklch(56.5% 0.115 121.8)

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

#85915E

Grass Green · Gray · Olive Green

HEX
#85915E
RGB
rgb(133, 145, 94)
HSL
hsl(74, 21%, 47%)
HSB
hsb(74, 35%, 57%)
CMYK
cmyk(8%, 0%, 35%, 43%)
Oklch
oklch(63.4% 0.073 119.3)

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

#ABB392

Willow Green · DarkGray · Apple Green

HEX
#ABB392
RGB
rgb(171, 179, 146)
HSL
hsl(75, 18%, 64%)
HSB
hsb(75, 18%, 70%)
CMYK
cmyk(4%, 0%, 18%, 30%)
Oklch
oklch(75.2% 0.047 118.6)

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

#D7DEBF

Willow Green · LightGray · Mint Green

HEX
#D7DEBF
RGB
rgb(215, 222, 191)
HSL
hsl(74, 32%, 81%)
HSB
hsb(74, 14%, 87%)
CMYK
cmyk(3%, 0%, 14%, 13%)
Oklch
oklch(88.7% 0.042 117.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D4035
383540

Analogous

403D35
3D4035
384035

Triadic

3D4035
353D40
40353D

Split-Comp.

3D4035
353840
3D3540

Tetradic

3D4035
35403D
383540
403538

Contrast Matrix WCAG 2.1 Contrast

3D4035
6B8029
85915E
ABB392
D7DEBF
—
2.4
Fail
3.1
AA Large
4.8
AA
7.6
AAA
2.4
Fail
—
1.3
Fail
2.0
Fail
3.2
AA Large
3.1
AA Large
1.3
Fail
—
1.5
Fail
2.4
Fail
4.8
AA
2.0
Fail
1.5
Fail
—
1.6
Fail
7.6
AAA
3.2
AA Large
2.4
Fail
1.6
Fail
—
White BG
10.6AAA
4.4AA Large
3.4AA Large
2.2Fail
1.4Fail
Black BG
2.0Fail
4.7AA
6.2AA
9.6AAA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3E38
74743E
8A8A6A
AEAF9A
DADAC7

Deuteranopia

3E3E38
737143
8A896D
AEAD9C
DAD9C8

Tritanopia

3D3A3A
6C4F52
867476
ABA0A2
D7CCCE

Achromatopsia

3E3E3E
707070
888888
ADADAD
D8D8D8

Shades & Tints Shades & Tints

#3D4035

Dark
Light

#6B8029

Dark
Light

#85915E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d4035;
  --color-2: #6b8029;
  --color-3: #85915e;
  --color-4: #abb392;
  --color-5: #d7debf;
}

SCSS

$color-1: #3d4035;
$color-2: #6b8029;
$color-3: #85915e;
$color-4: #abb392;
$color-5: #d7debf;

TAILWIND

colors: {
  'brand-1': '#3d4035',
  'brand-2': '#6b8029',
  'brand-3': '#85915e',
  'brand-4': '#abb392',
  'brand-5': '#d7debf',
}

RGB Array

[61, 64, 53], [107, 128, 41], [133, 145, 94], [171, 179, 146], [215, 222, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D4035, #6B8029, #85915E, #ABB392, #D7DEBF is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #3d4035; --color-2: #6b8029; --color-3: #85915e; --color-4: #abb392; --color-5: #d7debf. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 general-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