#5B5E43 + #528177 + #3D9596 + #9BB262 + #A3C767 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5B5E43

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#5B5E43

RGB

rgb(91, 94, 67)

HSL

hsl(67, 17%, 32%)

HSB

hsb(67, 29%, 37%)

CMYK

cmyk(3%, 0%, 29%, 63%)

Oklch

oklch(47.2% 0.041 113.2)

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

#528177

Mineral Blue · DimGray · Mint Ice

HEX

#528177

RGB

rgb(82, 129, 119)

HSL

hsl(167, 22%, 41%)

HSB

hsb(167, 36%, 51%)

CMYK

cmyk(36%, 0%, 8%, 49%)

Oklch

oklch(56.6% 0.054 179.3)

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

#3D9596

Slate Blue · CadetBlue · Mint Ice

HEX

#3D9596

RGB

rgb(61, 149, 150)

HSL

hsl(181, 42%, 41%)

HSB

hsb(181, 59%, 59%)

CMYK

cmyk(59%, 1%, 0%, 41%)

Oklch

oklch(61.8% 0.083 196.3)

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

#9BB262

Grass Green · DarkSeaGreen · Olive Green

HEX

#9BB262

RGB

rgb(155, 178, 98)

HSL

hsl(77, 34%, 54%)

HSB

hsb(77, 45%, 70%)

CMYK

cmyk(13%, 0%, 45%, 30%)

Oklch

oklch(72.8% 0.109 122.3)

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

#A3C767

Grass Green · DarkSeaGreen · Olive Green

HEX

#A3C767

RGB

rgb(163, 199, 103)

HSL

hsl(83, 46%, 59%)

HSB

hsb(83, 48%, 78%)

CMYK

cmyk(18%, 0%, 48%, 22%)

Oklch

oklch(78.2% 0.130 126.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5B5E43

47445F

Analogous

5F5544

5B5E43

4E5F44

Triadic

5B5E43

445C5F

5F445C

Split-Comp.

5B5E43

444E5F

55445F

Tetradic

5B5E43

445F55

47445F

5F444E

Contrast Matrix WCAG 2.1 Contrast

5B5E43	528177	3D9596	9BB262	A3C767
—	1.5 Fail	1.9 Fail	2.9 Fail	3.5 AA Large
1.5 Fail	—	1.2 Fail	1.9 Fail	2.3 Fail
1.9 Fail	1.2 Fail	—	1.5 Fail	1.8 Fail
2.9 Fail	1.9 Fail	1.5 Fail	—	1.2 Fail
3.5 AA Large	2.3 Fail	1.8 Fail	1.2 Fail	—

White BG

6.7AA

4.4AA Large

3.5AA Large

2.3Fail

1.9Fail

Black BG

3.1AA Large

4.8AA

5.9AA

8.9AAA

10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5C5C4A

666779

636496

A5A575

B3B37E

Deuteranopia

5C5C4B

64607A

5E5796

A4A27A

B1AE84

Tritanopia

5B4F50

547B7C

419696

9C8588

A59195

Achromatopsia

5A5A5A

727272

7B7B7B

A2A2A2

B1B1B1

Shades & Tints Shades & Tints

#5B5E43

Dark

Light

#528177

Dark

Light

#3D9596

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5b5e43;
  --color-2: #528177;
  --color-3: #3d9596;
  --color-4: #9bb262;
  --color-5: #a3c767;
}

SCSS

$color-1: #5b5e43;
$color-2: #528177;
$color-3: #3d9596;
$color-4: #9bb262;
$color-5: #a3c767;

TAILWIND

colors: {
  'brand-1': '#5b5e43',
  'brand-2': '#528177',
  'brand-3': '#3d9596',
  'brand-4': '#9bb262',
  'brand-5': '#a3c767',
}

RGB Array

[91, 94, 67], [82, 129, 119], [61, 149, 150], [155, 178, 98], [163, 199, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5B5E43, #528177, #3D9596, #9BB262, #A3C767 is ideal for: corporate websites, product showcases, portfolios. 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: #5b5e43; --color-2: #528177; --color-3: #3d9596; --color-4: #9bb262; --color-5: #a3c767. 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 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