#3A4009 + #5F8636 + #624A64 + #13A76E + #83AA5B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3A4009

Autumn Sage · DarkOliveGreen · Amber Gold

HEX

#3A4009

RGB

rgb(58, 64, 9)

HSL

hsl(67, 75%, 14%)

HSB

hsb(67, 86%, 25%)

CMYK

cmyk(9%, 0%, 86%, 75%)

Oklch

oklch(35.4% 0.074 115.8)

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

#5F8636

Grass Green · DarkOliveGreen · Forest Green

HEX

#5F8636

RGB

rgb(95, 134, 54)

HSL

hsl(89, 43%, 37%)

HSB

hsb(89, 60%, 53%)

CMYK

cmyk(29%, 0%, 60%, 47%)

Oklch

oklch(57.3% 0.118 131.0)

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

#624A64

Dark Plum · DimGray · Eggplant

HEX

#624A64

RGB

rgb(98, 74, 100)

HSL

hsl(295, 15%, 34%)

HSB

hsb(295, 26%, 39%)

CMYK

cmyk(2%, 26%, 0%, 61%)

Oklch

oklch(44.4% 0.051 323.9)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#13A76E

Mineral Blue · MediumSeaGreen · Forest Green

HEX

#13A76E

RGB

rgb(19, 167, 110)

HSL

hsl(157, 80%, 36%)

HSB

hsb(157, 89%, 65%)

CMYK

cmyk(89%, 0%, 34%, 35%)

Oklch

oklch(64.4% 0.143 159.7)

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

#83AA5B

Celadon · Gray · Olive Green

HEX

#83AA5B

RGB

rgb(131, 170, 91)

HSL

hsl(90, 32%, 51%)

HSB

hsb(90, 46%, 67%)

CMYK

cmyk(23%, 0%, 46%, 33%)

Oklch

oklch(69.1% 0.115 130.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A4009

0F093E

Analogous

3E2A09

3A4009

1D3E09

Triadic

3A4009

09383E

3E0938

Split-Comp.

3A4009

091D3E

2A093E

Tetradic

3A4009

093E2A

0F093E

3E091D

Contrast Matrix WCAG 2.1 Contrast

3A4009	5F8636	624A64	13A76E	83AA5B
—	2.6 Fail	1.4 Fail	3.5 AA Large	4.1 AA Large
2.6 Fail	—	1.8 Fail	1.4 Fail	1.6 Fail
1.4 Fail	1.8 Fail	—	2.5 Fail	2.9 Fail
3.5 AA Large	1.4 Fail	2.5 Fail	—	1.2 Fail
4.1 AA Large	1.6 Fail	2.9 Fail	1.2 Fail	—

White BG

11.0AAA

4.2AA Large

7.8AAA

3.1AA Large

2.7Fail

Black BG

1.9Fail

4.9AA

2.7Fail

6.8AA

7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3D3D16

707049

58575E

53547C

94946E

Deuteranopia

3C3C1A

6E6B4E

595B5C

4B3F7F

928F73

Tritanopia

3A2123

61595C

615958

1A8789

857D81

Achromatopsia

383838

717171

545454

747474

959595

Shades & Tints Shades & Tints

#3A4009

Dark

Light

#5F8636

Dark

Light

#624A64

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a4009;
  --color-2: #5f8636;
  --color-3: #624a64;
  --color-4: #13a76e;
  --color-5: #83aa5b;
}

SCSS

$color-1: #3a4009;
$color-2: #5f8636;
$color-3: #624a64;
$color-4: #13a76e;
$color-5: #83aa5b;

TAILWIND

colors: {
  'brand-1': '#3a4009',
  'brand-2': '#5f8636',
  'brand-3': '#624a64',
  'brand-4': '#13a76e',
  'brand-5': '#83aa5b',
}

RGB Array

[58, 64, 9], [95, 134, 54], [98, 74, 100], [19, 167, 110], [131, 170, 91]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3A4009, #5F8636, #624A64, #13A76E, #83AA5B 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: #3a4009; --color-2: #5f8636; --color-3: #624a64; --color-4: #13a76e; --color-5: #83aa5b. 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 general-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