#76822B + #90966A + #338C9E + #385459 + #291F21 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#76822B

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#76822B

RGB

rgb(118, 130, 43)

HSL

hsl(68, 50%, 34%)

HSB

hsb(68, 67%, 51%)

CMYK

cmyk(9%, 0%, 67%, 49%)

Oklch

oklch(57.9% 0.111 116.7)

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

#90966A

Autumn Sage · Gray · Honey Gold

HEX

#90966A

RGB

rgb(144, 150, 106)

HSL

hsl(68, 17%, 50%)

HSB

hsb(68, 29%, 59%)

CMYK

cmyk(4%, 0%, 29%, 41%)

Oklch

oklch(65.7% 0.062 114.4)

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

#338C9E

Lake Blue · SteelBlue · Mint Ice

HEX

#338C9E

RGB

rgb(51, 140, 158)

HSL

hsl(190, 51%, 41%)

HSB

hsb(190, 68%, 62%)

CMYK

cmyk(68%, 11%, 0%, 38%)

Oklch

oklch(59.5% 0.087 213.6)

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

#385459

Slate Blue · DarkSlateGray · Mint Ice

HEX

#385459

RGB

rgb(56, 84, 89)

HSL

hsl(189, 23%, 28%)

HSB

hsb(189, 37%, 35%)

CMYK

cmyk(37%, 6%, 0%, 65%)

Oklch

oklch(42.6% 0.034 209.8)

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

#291F21

Crimson · Black · Deep Berry

HEX

#291F21

RGB

rgb(41, 31, 33)

HSL

hsl(348, 14%, 14%)

HSB

hsb(348, 24%, 16%)

CMYK

cmyk(0%, 24%, 20%, 84%)

Oklch

oklch(25.2% 0.016 4.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

76822B

372B82

Analogous

82622B

76822B

4B822B

Triadic

76822B

2B7682

822B76

Split-Comp.

76822B

2B4B82

622B82

Tetradic

76822B

2B8262

372B82

822B4B

Contrast Matrix WCAG 2.1 Contrast

76822B	90966A	338C9E	385459	291F21
—	1.4 Fail	1.1 Fail	1.9 Fail	3.8 AA Large
1.4 Fail	—	1.3 Fail	2.6 Fail	5.1 AA
1.1 Fail	1.3 Fail	—	2.1 Fail	4.1 AA Large
1.9 Fail	2.6 Fail	2.1 Fail	—	2.0 Fail
3.8 AA Large	5.1 AA	4.1 AA Large	2.0 Fail	—

White BG

4.2AA Large

3.1AA Large

3.9AA Large

8.1AAA

16.0AAA

Black BG

5.0AA

6.8AA

5.4AA

2.6Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B40

939375

5A5A9A

444458

252521

Deuteranopia

7B7A45

929277

544E99

434058

252620

Tritanopia

775154

907D7F

379695

395757

282020

Achromatopsia

747474

8F8F8F

737373

4C4C4C

222222

Shades & Tints Shades & Tints

#76822B

Dark

Light

#90966A

Dark

Light

#338C9E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #76822b;
  --color-2: #90966a;
  --color-3: #338c9e;
  --color-4: #385459;
  --color-5: #291f21;
}

SCSS

$color-1: #76822b;
$color-2: #90966a;
$color-3: #338c9e;
$color-4: #385459;
$color-5: #291f21;

TAILWIND

colors: {
  'brand-1': '#76822b',
  'brand-2': '#90966a',
  'brand-3': '#338c9e',
  'brand-4': '#385459',
  'brand-5': '#291f21',
}

RGB Array

[118, 130, 43], [144, 150, 106], [51, 140, 158], [56, 84, 89], [41, 31, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #76822B, #90966A, #338C9E, #385459, #291F21 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: #76822b; --color-2: #90966a; --color-3: #338c9e; --color-4: #385459; --color-5: #291f21. 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