#958B1A + #8C9752 + #678B7F + #405858 + #33211F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#958B1A

Autumn Sage · Olive · Honey Gold

HEX

#958B1A

RGB

rgb(149, 139, 26)

HSL

hsl(55, 70%, 34%)

HSB

hsb(55, 83%, 58%)

CMYK

cmyk(0%, 7%, 83%, 42%)

Oklch

oklch(62.6% 0.125 104.0)

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

#8C9752

Grass Green · Gray · Olive Green

HEX

#8C9752

RGB

rgb(140, 151, 82)

HSL

hsl(70, 30%, 46%)

HSB

hsb(70, 46%, 59%)

CMYK

cmyk(7%, 0%, 46%, 41%)

Oklch

oklch(65.1% 0.094 116.5)

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

#678B7F

Mineral Blue · SlateGray · Mint Ice

HEX

#678B7F

RGB

rgb(103, 139, 127)

HSL

hsl(160, 15%, 47%)

HSB

hsb(160, 26%, 55%)

CMYK

cmyk(26%, 0%, 9%, 45%)

Oklch

oklch(60.6% 0.044 172.2)

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

#405858

Slate Blue · DarkSlateGray · Mint Ice

HEX

#405858

RGB

rgb(64, 88, 88)

HSL

hsl(180, 16%, 30%)

HSB

hsb(180, 27%, 35%)

CMYK

cmyk(27%, 0%, 0%, 65%)

Oklch

oklch(44.1% 0.029 196.1)

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

#33211F

Crimson · DarkSlateGray · Deep Berry

HEX

#33211F

RGB

rgb(51, 33, 31)

HSL

hsl(6, 24%, 16%)

HSB

hsb(6, 39%, 20%)

CMYK

cmyk(0%, 35%, 39%, 80%)

Oklch

oklch(27.0% 0.028 26.2)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

958B1A

1A2493

Analogous

934D1A

958B1A

61931A

Triadic

958B1A

1A9389

891A93

Split-Comp.

958B1A

1A6193

4D1A93

Tetradic

958B1A

1A934D

1A2493

931A61

Contrast Matrix WCAG 2.1 Contrast

958B1A	8C9752	678B7F	405858	33211F
—	1.1 Fail	1.1 Fail	2.2 Fail	4.3 AA Large
1.1 Fail	—	1.2 Fail	2.4 Fail	4.8 AA
1.1 Fail	1.2 Fail	—	2.0 Fail	4.0 AA Large
2.2 Fail	2.4 Fail	2.0 Fail	—	2.0 Fail
4.3 AA Large	4.8 AA	4.0 AA Large	2.0 Fail	—

White BG

3.5AA Large

3.2AA Large

3.8AA Large

7.6AAA

15.2AAA

Black BG

6.0AA

6.7AA

5.6AA

2.8Fail

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

919135

919163

777782

4A4B58

2B2B1F

Deuteranopia

91923C

908F67

757283

494758

2C2E20

Tritanopia

944B50

8D7073

698485

415858

322020

Achromatopsia

818181

8C8C8C

7F7F7F

515151

262626

Shades & Tints Shades & Tints

#958B1A

Dark

Light

#8C9752

Dark

Light

#678B7F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #958b1a;
  --color-2: #8c9752;
  --color-3: #678b7f;
  --color-4: #405858;
  --color-5: #33211f;
}

SCSS

$color-1: #958b1a;
$color-2: #8c9752;
$color-3: #678b7f;
$color-4: #405858;
$color-5: #33211f;

TAILWIND

colors: {
  'brand-1': '#958b1a',
  'brand-2': '#8c9752',
  'brand-3': '#678b7f',
  'brand-4': '#405858',
  'brand-5': '#33211f',
}

RGB Array

[149, 139, 26], [140, 151, 82], [103, 139, 127], [64, 88, 88], [51, 33, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #958B1A, #8C9752, #678B7F, #405858, #33211F 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: #958b1a; --color-2: #8c9752; --color-3: #678b7f; --color-4: #405858; --color-5: #33211f. 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