← Back to Editor

#9C9772 · #C9B200 · #819C72 · #C91C00 · #729C8D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#9C9772

Autumn Sage · Gray · Sunflower

HEX
#9C9772
RGB
rgb(156, 151, 114)
HSL
hsl(53, 18%, 53%)
HSB
hsb(53, 27%, 61%)
CMYK
cmyk(0%, 3%, 27%, 39%)
Oklch
oklch(67.1% 0.052 101.2)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#C9B200

Autumn Sage · GoldenRod · Honey Gold

HEX
#C9B200
RGB
rgb(201, 178, 0)
HSL
hsl(53, 100%, 39%)
HSB
hsb(53, 100%, 79%)
CMYK
cmyk(0%, 11%, 100%, 21%)
Oklch
oklch(76.0% 0.158 100.0)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#819C72

Celadon · Gray · Olive Green

HEX
#819C72
RGB
rgb(129, 156, 114)
HSL
hsl(99, 18%, 53%)
HSB
hsb(99, 27%, 61%)
CMYK
cmyk(17%, 0%, 27%, 39%)
Oklch
oklch(66.1% 0.068 134.6)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#C91C00

Vermilion · FireBrick · Wine Red

HEX
#C91C00
RGB
rgb(201, 28, 0)
HSL
hsl(8, 100%, 39%)
HSB
hsb(8, 100%, 79%)
CMYK
cmyk(0%, 86%, 100%, 21%)
Oklch
oklch(53.4% 0.207 31.2)

TraditionalVermilion」· PaintWine Red」· Creative Blush Sunrise

#729C8D

Mineral Blue · LightSlateGray · Olive Green

HEX
#729C8D
RGB
rgb(114, 156, 141)
HSL
hsl(159, 18%, 53%)
HSB
hsb(159, 27%, 61%)
CMYK
cmyk(27%, 0%, 10%, 39%)
Oklch
oklch(65.8% 0.051 170.6)

TraditionalMineral Blue」· PaintOlive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9C9772
72779D

Analogous

9D8272
9C9772
8C9D72

Triadic

9C9772
729D98
98729D

Split-Comp.

9C9772
728C9D
82729D

Tetradic

9C9772
729D82
72779D
9D728C

Contrast Matrix WCAG 2.1 Contrast

9C9772
C9B200
819C72
C91C00
729C8D
1.4
Fail
1.0
Fail
1.9
Fail
1.0
Fail
1.4
Fail
1.4
Fail
2.7
Fail
1.4
Fail
1.0
Fail
1.4
Fail
1.9
Fail
1.0
Fail
1.9
Fail
2.7
Fail
1.9
Fail
1.9
Fail
1.0
Fail
1.4
Fail
1.0
Fail
1.9
Fail
White BG
3.0Fail
2.1Fail
3.0AA Large
5.8AA
3.1AA Large
Black BG
7.1AAA
9.9AAA
6.9AA
3.6AA Large
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A9A7B
BFBF2B
8D8D7C
7E7D07
848591

Deuteranopia

9A9B7D
C0C235
8B897F
889508
827F92

Tritanopia

9C8284
C84D55
828486
C00C0D
749394

Achromatopsia

949494
A5A5A5
8F8F8F
4D4D4D
8E8E8E

Shades & Tints Shades & Tints

#9C9772

Dark
Light

#C9B200

Dark
Light

#819C72

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9c9772;
  --color-2: #c9b200;
  --color-3: #819c72;
  --color-4: #c91c00;
  --color-5: #729c8d;
}

SCSS

$color-1: #9c9772;
$color-2: #c9b200;
$color-3: #819c72;
$color-4: #c91c00;
$color-5: #729c8d;

TAILWIND

colors: {
  'brand-1': '#9c9772',
  'brand-2': '#c9b200',
  'brand-3': '#819c72',
  'brand-4': '#c91c00',
  'brand-5': '#729c8d',
}

RGB Array

[156, 151, 114], [201, 178, 0], [129, 156, 114], [201, 28, 0], [114, 156, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9C9772, #C9B200, #819C72, #C91C00, #729C8D 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: #9c9772; --color-2: #c9b200; --color-3: #819c72; --color-4: #c91c00; --color-5: #729c8d. 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