← Back to Editor

#898858 · #34331C · #775B94 · #859B83 · #E2B11D

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

#898858

Autumn Sage · Gray · Honey Gold

HEX
#898858
RGB
rgb(137, 136, 88)
HSL
hsl(59, 22%, 44%)
HSB
hsb(59, 36%, 54%)
CMYK
cmyk(0%, 1%, 36%, 46%)
Oklch
oklch(61.6% 0.067 107.2)

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

#34331C

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#34331C
RGB
rgb(52, 51, 28)
HSL
hsl(58, 30%, 16%)
HSB
hsb(58, 46%, 20%)
CMYK
cmyk(0%, 2%, 46%, 80%)
Oklch
oklch(31.6% 0.038 106.2)

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

#775B94

Deep Indigo · SlateGray · Violet

HEX
#775B94
RGB
rgb(119, 91, 148)
HSL
hsl(269, 24%, 47%)
HSB
hsb(269, 39%, 58%)
CMYK
cmyk(20%, 39%, 0%, 42%)
Oklch
oklch(52.3% 0.093 306.0)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#859B83

Celadon · Gray · Olive Green

HEX
#859B83
RGB
rgb(133, 155, 131)
HSL
hsl(115, 11%, 56%)
HSB
hsb(115, 15%, 61%)
CMYK
cmyk(14%, 0%, 15%, 39%)
Oklch
oklch(66.5% 0.043 142.8)

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

#E2B11D

Ochre · GoldenRod · Honey Gold

HEX
#E2B11D
RGB
rgb(226, 177, 29)
HSL
hsl(45, 77%, 50%)
HSB
hsb(45, 87%, 89%)
CMYK
cmyk(0%, 22%, 87%, 11%)
Oklch
oklch(78.3% 0.154 87.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

898858
585889

Analogous

896F58
898858
718958

Triadic

898858
588988
885889

Split-Comp.

898858
587189
6F5889

Tetradic

898858
58896F
585889
895871

Contrast Matrix WCAG 2.1 Contrast

898858
34331C
775B94
859B83
E2B11D
—
3.5
AA Large
1.5
Fail
1.2
Fail
1.8
Fail
3.5
AA Large
—
2.3
Fail
4.3
AA Large
6.4
AA
1.5
Fail
2.3
Fail
—
1.9
Fail
2.8
Fail
1.2
Fail
4.3
AA Large
1.9
Fail
—
1.5
Fail
1.8
Fail
6.4
AA
2.8
Fail
1.5
Fail
—
White BG
3.7AA Large
12.8AAA
5.7AA
3.0Fail
2.0Fail
Black BG
5.7AA
1.6Fail
3.7AA Large
7.0AAA
10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

898964
343422
6B6B86
8F8F89
CDCC41

Deuteranopia

898966
343423
6D6F83
8D8C8A
D0D349

Tritanopia

896D6F
342627
767B79
868D8E
E05D63

Achromatopsia

838383
313131
6A6A6A
929292
AFAFAF

Shades & Tints Shades & Tints

#898858

Dark
Light

#34331C

Dark
Light

#775B94

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #898858;
  --color-2: #34331c;
  --color-3: #775b94;
  --color-4: #859b83;
  --color-5: #e2b11d;
}

SCSS

$color-1: #898858;
$color-2: #34331c;
$color-3: #775b94;
$color-4: #859b83;
$color-5: #e2b11d;

TAILWIND

colors: {
  'brand-1': '#898858',
  'brand-2': '#34331c',
  'brand-3': '#775b94',
  'brand-4': '#859b83',
  'brand-5': '#e2b11d',
}

RGB Array

[137, 136, 88], [52, 51, 28], [119, 91, 148], [133, 155, 131], [226, 177, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #898858, #34331C, #775B94, #859B83, #E2B11D 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: #898858; --color-2: #34331c; --color-3: #775b94; --color-4: #859b83; --color-5: #e2b11d. 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