← Back to Editor

#E6A855 · #9D9560 · #717655 · #774C59 · #9B0D3C

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 Library

Color Details Color Details

#E6A855

Ginger · SandyBrown · Warm Sun

HEX
#E6A855
RGB
rgb(230, 168, 85)
HSL
hsl(34, 74%, 62%)
HSB
hsb(34, 63%, 90%)
CMYK
cmyk(0%, 27%, 63%, 10%)
Oklch
oklch(77.4% 0.123 72.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#9D9560

Autumn Sage · Gray · Honey Gold

HEX
#9D9560
RGB
rgb(157, 149, 96)
HSL
hsl(52, 24%, 50%)
HSB
hsb(52, 39%, 62%)
CMYK
cmyk(0%, 5%, 39%, 38%)
Oklch
oklch(66.4% 0.073 100.7)

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

#717655

Autumn Sage · DimGray · Honey Gold

HEX
#717655
RGB
rgb(113, 118, 85)
HSL
hsl(69, 16%, 40%)
HSB
hsb(69, 28%, 46%)
CMYK
cmyk(4%, 0%, 28%, 54%)
Oklch
oklch(55.3% 0.049 115.0)

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

#774C59

Dark Violet · DimGray · Camellia

HEX
#774C59
RGB
rgb(119, 76, 89)
HSL
hsl(342, 22%, 38%)
HSB
hsb(342, 36%, 47%)
CMYK
cmyk(0%, 36%, 25%, 53%)
Oklch
oklch(46.9% 0.061 0.1)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#9B0D3C

Dark Violet · Brown · Camellia

HEX
#9B0D3C
RGB
rgb(155, 13, 60)
HSL
hsl(340, 85%, 33%)
HSB
hsb(340, 92%, 61%)
CMYK
cmyk(0%, 92%, 61%, 39%)
Oklch
oklch(44.5% 0.171 11.0)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6A855
5695E6

Analogous

E66056
E6A855
DCE656

Triadic

E6A855
56E6A8
A856E6

Split-Comp.

E6A855
56DCE6
6056E6

Tetradic

E6A855
56E660
5695E6
E656DC

Contrast Matrix WCAG 2.1 Contrast

E6A855
9D9560
717655
774C59
9B0D3C
—
1.5
Fail
2.3
Fail
3.4
AA Large
4.0
AA Large
1.5
Fail
—
1.6
Fail
2.3
Fail
2.7
Fail
2.3
Fail
1.6
Fail
—
1.5
Fail
1.8
Fail
3.4
AA Large
2.3
Fail
1.5
Fail
—
1.2
Fail
4.0
AA Large
2.7
Fail
1.8
Fail
1.2
Fail
—
White BG
2.1Fail
3.0AA Large
4.7AA
7.1AAA
8.3AAA
Black BG
10.1AAA
6.9AA
4.4AA Large
3.0Fail
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCB69
9A996D
73735D
646456
5E5C31

Deuteranopia

CFD36E
9A9B70
73735F
676A55
66702E

Tritanopia

E3797C
9D7779
716365
755353
942826

Achromatopsia

B1B1B1
919191
717171
5A5A5A
3D3D3D

Shades & Tints Shades & Tints

#E6A855

Dark
Light

#9D9560

Dark
Light

#717655

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6a855;
  --color-2: #9d9560;
  --color-3: #717655;
  --color-4: #774c59;
  --color-5: #9b0d3c;
}

SCSS

$color-1: #e6a855;
$color-2: #9d9560;
$color-3: #717655;
$color-4: #774c59;
$color-5: #9b0d3c;

TAILWIND

colors: {
  'brand-1': '#e6a855',
  'brand-2': '#9d9560',
  'brand-3': '#717655',
  'brand-4': '#774c59',
  'brand-5': '#9b0d3c',
}

RGB Array

[230, 168, 85], [157, 149, 96], [113, 118, 85], [119, 76, 89], [155, 13, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6A855, #9D9560, #717655, #774C59, #9B0D3C 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: #e6a855; --color-2: #9d9560; --color-3: #717655; --color-4: #774c59; --color-5: #9b0d3c. 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