#08D689 + #A4BD41 + #6AA83C + #5A6425 + #3A3151 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#08D689

Mineral Blue · MediumSpringGreen · Olive Green

HEX

#08D689

RGB

rgb(8, 214, 137)

HSL

hsl(158, 93%, 44%)

HSB

hsb(158, 96%, 84%)

CMYK

cmyk(96%, 0%, 36%, 16%)

Oklch

oklch(77.2% 0.178 158.5)

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

#A4BD41

Grass Green · GoldenRod · Olive Green

HEX

#A4BD41

RGB

rgb(164, 189, 65)

HSL

hsl(72, 49%, 50%)

HSB

hsb(72, 66%, 74%)

CMYK

cmyk(13%, 0%, 66%, 26%)

Oklch

oklch(75.6% 0.151 119.9)

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

#6AA83C

Celadon · DarkOliveGreen · Olive Green

HEX

#6AA83C

RGB

rgb(106, 168, 60)

HSL

hsl(94, 47%, 45%)

HSB

hsb(94, 64%, 66%)

CMYK

cmyk(37%, 0%, 64%, 34%)

Oklch

oklch(66.7% 0.155 134.2)

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

#5A6425

Grass Green · DarkOliveGreen · Forest Green

HEX

#5A6425

RGB

rgb(90, 100, 37)

HSL

hsl(70, 46%, 27%)

HSB

hsb(70, 63%, 39%)

CMYK

cmyk(10%, 0%, 63%, 61%)

Oklch

oklch(48.0% 0.087 117.4)

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

#3A3151

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#3A3151

RGB

rgb(58, 49, 81)

HSL

hsl(257, 25%, 25%)

HSB

hsb(257, 40%, 32%)

CMYK

cmyk(28%, 40%, 0%, 68%)

Oklch

oklch(33.8% 0.056 296.2)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

08D689

D90854

Analogous

08D924

08D689

08BDD9

Triadic

08D689

8C08D9

D98C08

Split-Comp.

08D689

D908BD

D92408

Tetradic

08D689

2408D9

D90854

BDD908

Contrast Matrix WCAG 2.1 Contrast

08D689	A4BD41	6AA83C	5A6425	3A3151
—	1.1 Fail	1.5 Fail	3.3 AA Large	6.3 AA
1.1 Fail	—	1.4 Fail	3.0 AA Large	5.7 AA
1.5 Fail	1.4 Fail	—	2.2 Fail	4.2 AA Large
3.3 AA Large	3.0 AA Large	2.2 Fail	—	1.9 Fail
6.3 AA	5.7 AA	4.2 AA Large	1.9 Fail	—

White BG

1.9Fail

2.1Fail

2.9Fail

6.4AA

12.1AAA

Black BG

11.0AAA

9.9AAA

7.3AAA

3.3AA Large

1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

61639C

AFAF5F

858556

5E5E34

363649

Deuteranopia

5546A0

ADAC66

817D5C

5E5D38

373747

Tritanopia

12AAAE

A5777C

6D6B6F

5B4043

3A4342

Achromatopsia

909090

A7A7A7

898989

5A5A5A

373737

Shades & Tints Shades & Tints

#08D689

Dark

Light

#A4BD41

Dark

Light

#6AA83C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #08d689;
  --color-2: #a4bd41;
  --color-3: #6aa83c;
  --color-4: #5a6425;
  --color-5: #3a3151;
}

SCSS

$color-1: #08d689;
$color-2: #a4bd41;
$color-3: #6aa83c;
$color-4: #5a6425;
$color-5: #3a3151;

TAILWIND

colors: {
  'brand-1': '#08d689',
  'brand-2': '#a4bd41',
  'brand-3': '#6aa83c',
  'brand-4': '#5a6425',
  'brand-5': '#3a3151',
}

RGB Array

[8, 214, 137], [164, 189, 65], [106, 168, 60], [90, 100, 37], [58, 49, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #08D689, #A4BD41, #6AA83C, #5A6425, #3A3151 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: #08d689; --color-2: #a4bd41; --color-3: #6aa83c; --color-4: #5a6425; --color-5: #3a3151. 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