← Back to Editor

#9CA663 · #77804A · #5B6644 · #3F4D4B · #272B2B

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#9CA663

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#9CA663
RGB
rgb(156, 166, 99)
HSL
hsl(69, 27%, 52%)
HSB
hsb(69, 40%, 65%)
CMYK
cmyk(6%, 0%, 40%, 35%)
Oklch
oklch(70.1% 0.091 115.7)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#77804A

Grass Green · DimGray · Forest Green

HEX
#77804A
RGB
rgb(119, 128, 74)
HSL
hsl(70, 27%, 40%)
HSB
hsb(70, 42%, 50%)
CMYK
cmyk(7%, 0%, 42%, 50%)
Oklch
oklch(57.9% 0.077 116.6)

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

#5B6644

Grass Green · DarkOliveGreen · Forest Green

HEX
#5B6644
RGB
rgb(91, 102, 68)
HSL
hsl(79, 20%, 33%)
HSB
hsb(79, 33%, 40%)
CMYK
cmyk(11%, 0%, 33%, 60%)
Oklch
oklch(49.1% 0.053 122.9)

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

#3F4D4B

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#3F4D4B
RGB
rgb(63, 77, 75)
HSL
hsl(171, 10%, 27%)
HSB
hsb(171, 18%, 30%)
CMYK
cmyk(18%, 0%, 3%, 70%)
Oklch
oklch(40.7% 0.018 185.9)

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

#272B2B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#272B2B
RGB
rgb(39, 43, 43)
HSL
hsl(180, 5%, 16%)
HSB
hsb(180, 9%, 17%)
CMYK
cmyk(9%, 0%, 0%, 83%)
Oklch
oklch(28.5% 0.006 196.8)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9CA663
6D64A6

Analogous

A68F64
9CA663
7BA664

Triadic

9CA663
649CA6
A6649C

Split-Comp.

9CA663
647BA6
8F64A6

Tetradic

9CA663
64A68F
6D64A6
A6647B

Contrast Matrix WCAG 2.1 Contrast

9CA663
77804A
5B6644
3F4D4B
272B2B
—
1.6
Fail
2.3
Fail
3.4
AA Large
5.5
AA
1.6
Fail
—
1.4
Fail
2.1
Fail
3.4
AA Large
2.3
Fail
1.4
Fail
—
1.4
Fail
2.3
Fail
3.4
AA Large
2.1
Fail
1.4
Fail
—
1.6
Fail
5.5
AA
3.4
AA Large
2.3
Fail
1.6
Fail
—
White BG
2.6Fail
4.2AA Large
6.1AA
8.8AAA
14.3AAA
Black BG
8.0AAA
5.0AA
3.4AA Large
2.4Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A073
7B7B57
60604C
45454B
29292B

Deuteranopia

A09F77
7A7A5A
5F5E4E
44434C
29282B

Tritanopia

9D8083
776164
5C5354
404C4C
272B2B

Achromatopsia

9B9B9B
777777
5F5F5F
494949
2A2A2A

Shades & Tints Shades & Tints

#9CA663

Dark
Light

#77804A

Dark
Light

#5B6644

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9ca663;
  --color-2: #77804a;
  --color-3: #5b6644;
  --color-4: #3f4d4b;
  --color-5: #272b2b;
}

SCSS

$color-1: #9ca663;
$color-2: #77804a;
$color-3: #5b6644;
$color-4: #3f4d4b;
$color-5: #272b2b;

TAILWIND

colors: {
  'brand-1': '#9ca663',
  'brand-2': '#77804a',
  'brand-3': '#5b6644',
  'brand-4': '#3f4d4b',
  'brand-5': '#272b2b',
}

RGB Array

[156, 166, 99], [119, 128, 74], [91, 102, 68], [63, 77, 75], [39, 43, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9CA663, #77804A, #5B6644, #3F4D4B, #272B2B is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #9ca663; --color-2: #77804a; --color-3: #5b6644; --color-4: #3f4d4b; --color-5: #272b2b. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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