← Back to Editor

#604C33 · #74865E · #9A9A66 · #C3B264 · #DFDB9C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#604C33

Ochre · DarkOliveGreen · Amber Brown

HEX
#604C33
RGB
rgb(96, 76, 51)
HSL
hsl(33, 31%, 29%)
HSB
hsb(33, 47%, 38%)
CMYK
cmyk(0%, 21%, 47%, 62%)
Oklch
oklch(43.1% 0.047 72.3)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#74865E

Grass Green · DimGray · Olive Green

HEX
#74865E
RGB
rgb(116, 134, 94)
HSL
hsl(87, 18%, 45%)
HSB
hsb(87, 30%, 53%)
CMYK
cmyk(13%, 0%, 30%, 47%)
Oklch
oklch(59.5% 0.062 127.9)

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

#9A9A66

Autumn Sage · Gray · Honey Gold

HEX
#9A9A66
RGB
rgb(154, 154, 102)
HSL
hsl(60, 20%, 50%)
HSB
hsb(60, 34%, 60%)
CMYK
cmyk(0%, 0%, 34%, 40%)
Oklch
oklch(67.3% 0.071 108.2)

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

#C3B264

Ginger · Tan · Sunflower

HEX
#C3B264
RGB
rgb(195, 178, 100)
HSL
hsl(49, 44%, 58%)
HSB
hsb(49, 49%, 76%)
CMYK
cmyk(0%, 9%, 49%, 24%)
Oklch
oklch(76.1% 0.101 97.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#DFDB9C

Fresh Green · Khaki · Sunflower

HEX
#DFDB9C
RGB
rgb(223, 219, 156)
HSL
hsl(56, 51%, 74%)
HSB
hsb(56, 30%, 87%)
CMYK
cmyk(0%, 2%, 30%, 13%)
Oklch
oklch(88.0% 0.082 104.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

604C33
334861

Analogous

613533
604C33
5F6133

Triadic

604C33
33614C
4C3361

Split-Comp.

604C33
335F61
353361

Tetradic

604C33
336135
334861
61335F

Contrast Matrix WCAG 2.1 Contrast

604C33
74865E
9A9A66
C3B264
DFDB9C
—
2.1
Fail
2.8
Fail
3.8
AA Large
5.7
AA
2.1
Fail
—
1.4
Fail
1.9
Fail
2.8
Fail
2.8
Fail
1.4
Fail
—
1.4
Fail
2.1
Fail
3.8
AA Large
1.9
Fail
1.4
Fail
—
1.5
Fail
5.7
AA
2.8
Fail
2.1
Fail
1.5
Fail
—
White BG
8.1AAA
4.0AA Large
2.9Fail
2.1Fail
1.4Fail
Black BG
2.6Fail
5.3AA
7.2AAA
9.9AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

575739
7C7C68
9A9A73
BCBB77
DDDDAB

Deuteranopia

595A3B
7B796A
9A9A76
BDBE7B
DEDEAF

Tritanopia

5F3E3F
756F71
9A7D7F
C28689
DFB7BA

Achromatopsia

4F4F4F
7C7C7C
949494
AEAEAE
D5D5D5

Shades & Tints Shades & Tints

#604C33

Dark
Light

#74865E

Dark
Light

#9A9A66

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #604c33;
  --color-2: #74865e;
  --color-3: #9a9a66;
  --color-4: #c3b264;
  --color-5: #dfdb9c;
}

SCSS

$color-1: #604c33;
$color-2: #74865e;
$color-3: #9a9a66;
$color-4: #c3b264;
$color-5: #dfdb9c;

TAILWIND

colors: {
  'brand-1': '#604c33',
  'brand-2': '#74865e',
  'brand-3': '#9a9a66',
  'brand-4': '#c3b264',
  'brand-5': '#dfdb9c',
}

RGB Array

[96, 76, 51], [116, 134, 94], [154, 154, 102], [195, 178, 100], [223, 219, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #604C33, #74865E, #9A9A66, #C3B264, #DFDB9C is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #604c33; --color-2: #74865e; --color-3: #9a9a66; --color-4: #c3b264; --color-5: #dfdb9c. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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