#C96164 + #573E31 + #E8C64D + #9EB53F + #5D966C · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C96164

Crimson · LightCoral · Passion Red

HEX

#C96164

RGB

rgb(201, 97, 100)

HSL

hsl(358, 49%, 58%)

HSB

hsb(358, 52%, 79%)

CMYK

cmyk(0%, 52%, 50%, 21%)

Oklch

oklch(61.9% 0.133 19.9)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#573E31

Tangerine · DarkOliveGreen · Amber Brown

HEX

#573E31

RGB

rgb(87, 62, 49)

HSL

hsl(21, 28%, 27%)

HSB

hsb(21, 44%, 34%)

CMYK

cmyk(0%, 29%, 44%, 66%)

Oklch

oklch(38.8% 0.041 48.6)

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

#E8C64D

Ginger · SandyBrown · Sunflower

HEX

#E8C64D

RGB

rgb(232, 198, 77)

HSL

hsl(47, 77%, 61%)

HSB

hsb(47, 67%, 91%)

CMYK

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

Oklch

oklch(83.4% 0.142 93.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#9EB53F

Grass Green · GoldenRod · Olive Green

HEX

#9EB53F

RGB

rgb(158, 181, 63)

HSL

hsl(72, 48%, 48%)

HSB

hsb(72, 65%, 71%)

CMYK

cmyk(13%, 0%, 65%, 29%)

Oklch

oklch(73.3% 0.145 119.6)

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

#5D966C

Celadon · MediumSeaGreen · Olive Green

HEX

#5D966C

RGB

rgb(93, 150, 108)

HSL

hsl(136, 23%, 48%)

HSB

hsb(136, 38%, 59%)

CMYK

cmyk(38%, 0%, 28%, 41%)

Oklch

oklch(62.2% 0.088 151.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C96164

5FC8C5

Analogous

C85F97

C96164

C8905F

Triadic

C96164

63C85F

5F63C8

Split-Comp.

C96164

5FC890

5F97C8

Tetradic

C96164

97C85F

5FC8C5

905FC8

Contrast Matrix WCAG 2.1 Contrast

C96164	573E31	E8C64D	9EB53F	5D966C
—	2.5 Fail	2.3 Fail	1.7 Fail	1.1 Fail
2.5 Fail	—	5.9 AA	4.3 AA Large	2.8 Fail
2.3 Fail	5.9 AA	—	1.4 Fail	2.1 Fail
1.7 Fail	4.3 AA Large	1.4 Fail	—	1.5 Fail
1.1 Fail	2.8 Fail	2.1 Fail	1.5 Fail	—

White BG

3.9AA Large

9.8AAA

1.7Fail

2.3Fail

3.5AA Large

Black BG

5.4AA

2.1Fail

12.6AAA

9.1AAA

6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9C9B63

4C4C34

D9D96A

A8A85C

767676

Deuteranopia

A2AA63

4E5035

DBDE71

A7A562

726E79

Tritanopia

C46363

563737

E68186

9F7277

607E80

Achromatopsia

808080

444444

C2C2C2

A1A1A1

808080

Shades & Tints Shades & Tints

#C96164

Dark

Light

#573E31

Dark

Light

#E8C64D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c96164;
  --color-2: #573e31;
  --color-3: #e8c64d;
  --color-4: #9eb53f;
  --color-5: #5d966c;
}

SCSS

$color-1: #c96164;
$color-2: #573e31;
$color-3: #e8c64d;
$color-4: #9eb53f;
$color-5: #5d966c;

TAILWIND

colors: {
  'brand-1': '#c96164',
  'brand-2': '#573e31',
  'brand-3': '#e8c64d',
  'brand-4': '#9eb53f',
  'brand-5': '#5d966c',
}

RGB Array

[201, 97, 100], [87, 62, 49], [232, 198, 77], [158, 181, 63], [93, 150, 108]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #C96164, #573E31, #E8C64D, #9EB53F, #5D966C 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: #c96164; --color-2: #573e31; --color-3: #e8c64d; --color-4: #9eb53f; --color-5: #5d966c. 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 cool-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