#34780D + #478026 + #4B7A73 + #85806A + #A89654 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#34780D

Pine Green · ForestGreen · Forest Green

HEX

#34780D

RGB

rgb(52, 120, 13)

HSL

hsl(98, 80%, 26%)

HSB

hsb(98, 89%, 47%)

CMYK

cmyk(57%, 0%, 89%, 53%)

Oklch

oklch(50.8% 0.150 137.6)

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

#478026

Pine Green · DarkOliveGreen · Forest Green

HEX

#478026

RGB

rgb(71, 128, 38)

HSL

hsl(98, 54%, 33%)

HSB

hsb(98, 70%, 50%)

CMYK

cmyk(45%, 0%, 70%, 50%)

Oklch

oklch(54.1% 0.136 136.2)

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

#4B7A73

Mineral Blue · DimGray · Mint Ice

HEX

#4B7A73

RGB

rgb(75, 122, 115)

HSL

hsl(171, 24%, 39%)

HSB

hsb(171, 39%, 48%)

CMYK

cmyk(39%, 0%, 6%, 52%)

Oklch

oklch(54.4% 0.053 183.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#85806A

Ochre · Gray · Honey Gold

HEX

#85806A

RGB

rgb(133, 128, 106)

HSL

hsl(49, 11%, 47%)

HSB

hsb(49, 20%, 52%)

CMYK

cmyk(0%, 4%, 20%, 48%)

Oklch

oklch(59.8% 0.033 96.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#A89654

Ochre · Gray · Honey Gold

HEX

#A89654

RGB

rgb(168, 150, 84)

HSL

hsl(47, 33%, 49%)

HSB

hsb(47, 50%, 66%)

CMYK

cmyk(0%, 11%, 50%, 34%)

Oklch

oklch(67.4% 0.089 94.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

34780D

500D77

Analogous

69770D

34780D

0D771B

Triadic

34780D

0D3477

770D34

Split-Comp.

34780D

1B0D77

770D69

Tetradic

34780D

0D6977

500D77

771B0D

Contrast Matrix WCAG 2.1 Contrast

34780D	478026	4B7A73	85806A	A89654
—	1.1 Fail	1.1 Fail	1.4 Fail	1.9 Fail
1.1 Fail	—	1.0 Fail	1.2 Fail	1.6 Fail
1.1 Fail	1.0 Fail	—	1.2 Fail	1.7 Fail
1.4 Fail	1.2 Fail	1.2 Fail	—	1.4 Fail
1.9 Fail	1.6 Fail	1.7 Fail	1.4 Fail	—

White BG

5.5AA

4.8AA

4.0AA Large

2.9Fail

Black BG

3.8AA Large

4.4AA Large

4.3AA Large

5.3AA

7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

515227

60603C

5F6075

83836F

A0A064

Deuteranopia

4E482D

5C5841

5D5975

838471

A1A368

Tritanopia

373B40

4A4D51

4D7676

857474

A77173

Achromatopsia

575757

656565

6B6B6B

7F7F7F

949494

Shades & Tints Shades & Tints

#34780D

Dark

Light

#478026

Dark

Light

#4B7A73

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #34780d;
  --color-2: #478026;
  --color-3: #4b7a73;
  --color-4: #85806a;
  --color-5: #a89654;
}

SCSS

$color-1: #34780d;
$color-2: #478026;
$color-3: #4b7a73;
$color-4: #85806a;
$color-5: #a89654;

TAILWIND

colors: {
  'brand-1': '#34780d',
  'brand-2': '#478026',
  'brand-3': '#4b7a73',
  'brand-4': '#85806a',
  'brand-5': '#a89654',
}

RGB Array

[52, 120, 13], [71, 128, 38], [75, 122, 115], [133, 128, 106], [168, 150, 84]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #34780D, #478026, #4B7A73, #85806A, #A89654 is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #34780d; --color-2: #478026; --color-3: #4b7a73; --color-4: #85806a; --color-5: #a89654. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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. 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