← Back to Editor

#3E5231 · #606B40 · #858150 · #9E855F · #B8826E

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3E5231

Celadon · DarkSlateGray · Forest Green

HEX
#3E5231
RGB
rgb(62, 82, 49)
HSL
hsl(96, 25%, 26%)
HSB
hsb(96, 40%, 32%)
CMYK
cmyk(24%, 0%, 40%, 68%)
Oklch
oklch(41.2% 0.058 133.8)

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

#606B40

Grass Green · DarkOliveGreen · Forest Green

HEX
#606B40
RGB
rgb(96, 107, 64)
HSL
hsl(75, 25%, 34%)
HSB
hsb(75, 40%, 42%)
CMYK
cmyk(10%, 0%, 40%, 58%)
Oklch
oklch(50.7% 0.065 120.5)

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

#858150

Autumn Sage · DimGray · Honey Gold

HEX
#858150
RGB
rgb(133, 129, 80)
HSL
hsl(55, 25%, 42%)
HSB
hsb(55, 40%, 52%)
CMYK
cmyk(0%, 3%, 40%, 48%)
Oklch
oklch(59.5% 0.068 104.3)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#9E855F

Ochre · Gray · Amber Brown

HEX
#9E855F
RGB
rgb(158, 133, 95)
HSL
hsl(36, 25%, 50%)
HSB
hsb(36, 40%, 62%)
CMYK
cmyk(0%, 16%, 40%, 38%)
Oklch
oklch(63.0% 0.061 77.7)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#B8826E

Tangerine · DarkSalmon · Warm Sun

HEX
#B8826E
RGB
rgb(184, 130, 110)
HSL
hsl(16, 34%, 58%)
HSB
hsb(16, 40%, 72%)
CMYK
cmyk(0%, 29%, 40%, 28%)
Oklch
oklch(65.5% 0.073 41.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E5231
463253

Analogous

505332
3E5231
325335

Triadic

3E5231
323F53
53323F

Split-Comp.

3E5231
353253
533250

Tetradic

3E5231
325053
463253
533532

Contrast Matrix WCAG 2.1 Contrast

3E5231
606B40
858150
9E855F
B8826E
—
1.5
Fail
2.1
Fail
2.4
Fail
2.6
Fail
1.5
Fail
—
1.4
Fail
1.6
Fail
1.8
Fail
2.1
Fail
1.4
Fail
—
1.1
Fail
1.2
Fail
2.4
Fail
1.6
Fail
1.1
Fail
—
1.1
Fail
2.6
Fail
1.8
Fail
1.2
Fail
1.1
Fail
—
White BG
8.6AAA
5.7AA
4.0AA Large
3.5AA Large
3.3AA Large
Black BG
2.5Fail
3.7AA Large
5.3AA
6.0AA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

474739
65654A
83835C
939368
A1A073

Deuteranopia

46443B
64634D
84845F
95976A
A4A874

Tritanopia

3F3F41
615354
856567
9D6F71
B57778

Achromatopsia

484848
636363
7D7D7D
888888
909090

Shades & Tints Shades & Tints

#3E5231

Dark
Light

#606B40

Dark
Light

#858150

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e5231;
  --color-2: #606b40;
  --color-3: #858150;
  --color-4: #9e855f;
  --color-5: #b8826e;
}

SCSS

$color-1: #3e5231;
$color-2: #606b40;
$color-3: #858150;
$color-4: #9e855f;
$color-5: #b8826e;

TAILWIND

colors: {
  'brand-1': '#3e5231',
  'brand-2': '#606b40',
  'brand-3': '#858150',
  'brand-4': '#9e855f',
  'brand-5': '#b8826e',
}

RGB Array

[62, 82, 49], [96, 107, 64], [133, 129, 80], [158, 133, 95], [184, 130, 110]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #3E5231, #606B40, #858150, #9E855F, #B8826E 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: #3e5231; --color-2: #606b40; --color-3: #858150; --color-4: #9e855f; --color-5: #b8826e. 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 earth-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