← Back to Editor

#868650 · #598E76 · #45B397 · #4F3A5C · #8B6B97

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#868650

Autumn Sage · DimGray · Honey Gold

HEX
#868650
RGB
rgb(134, 134, 80)
HSL
hsl(60, 25%, 42%)
HSB
hsb(60, 40%, 53%)
CMYK
cmyk(0%, 0%, 40%, 47%)
Oklch
oklch(60.7% 0.075 108.4)

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

#598E76

Mineral Blue · SlateGray · Olive Green

HEX
#598E76
RGB
rgb(89, 142, 118)
HSL
hsl(153, 23%, 45%)
HSB
hsb(153, 37%, 56%)
CMYK
cmyk(37%, 0%, 17%, 44%)
Oklch
oklch(60.2% 0.068 164.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#45B397

Mineral Blue · CadetBlue · Mint Ice

HEX
#45B397
RGB
rgb(69, 179, 151)
HSL
hsl(165, 44%, 49%)
HSB
hsb(165, 61%, 70%)
CMYK
cmyk(61%, 0%, 16%, 30%)
Oklch
oklch(69.6% 0.109 173.2)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#4F3A5C

Dark Plum · DarkSlateGray · Eggplant

HEX
#4F3A5C
RGB
rgb(79, 58, 92)
HSL
hsl(277, 23%, 29%)
HSB
hsb(277, 37%, 36%)
CMYK
cmyk(14%, 37%, 0%, 64%)
Oklch
oklch(38.6% 0.062 311.9)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#8B6B97

Dark Plum · Gray · Violet

HEX
#8B6B97
RGB
rgb(139, 107, 151)
HSL
hsl(284, 17%, 51%)
HSB
hsb(284, 29%, 59%)
CMYK
cmyk(8%, 29%, 0%, 41%)
Oklch
oklch(57.5% 0.076 316.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

868650
505086

Analogous

866B50
868650
6B8650

Triadic

868650
508686
865086

Split-Comp.

868650
506B86
6B5086

Tetradic

868650
50866B
505086
86506B

Contrast Matrix WCAG 2.1 Contrast

868650
598E76
45B397
4F3A5C
8B6B97
—
1.0
Fail
1.5
Fail
2.6
Fail
1.2
Fail
1.0
Fail
—
1.5
Fail
2.7
Fail
1.2
Fail
1.5
Fail
1.5
Fail
—
3.9
AA Large
1.8
Fail
2.6
Fail
2.7
Fail
3.9
AA Large
—
2.2
Fail
1.2
Fail
1.2
Fail
1.8
Fail
2.2
Fail
—
White BG
3.8AA Large
3.8AA Large
2.6Fail
10.0AAA
4.5AA
Black BG
5.5AA
5.6AA
8.1AAA
2.1Fail
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86865D
70707C
75769E
464654
7D7D8C

Deuteranopia

868660
6D697D
6E669F
474952
7F818A

Tritanopia

86676A
5C8081
4BA3A4
4E4D4C
898482

Achromatopsia

808080
7B7B7B
8F8F8F
444444
7A7A7A

Shades & Tints Shades & Tints

#868650

Dark
Light

#598E76

Dark
Light

#45B397

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #868650;
  --color-2: #598e76;
  --color-3: #45b397;
  --color-4: #4f3a5c;
  --color-5: #8b6b97;
}

SCSS

$color-1: #868650;
$color-2: #598e76;
$color-3: #45b397;
$color-4: #4f3a5c;
$color-5: #8b6b97;

TAILWIND

colors: {
  'brand-1': '#868650',
  'brand-2': '#598e76',
  'brand-3': '#45b397',
  'brand-4': '#4f3a5c',
  'brand-5': '#8b6b97',
}

RGB Array

[134, 134, 80], [89, 142, 118], [69, 179, 151], [79, 58, 92], [139, 107, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #868650, #598E76, #45B397, #4F3A5C, #8B6B97 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #868650; --color-2: #598e76; --color-3: #45b397; --color-4: #4f3a5c; --color-5: #8b6b97. 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. Restrained colors convey professionalism and trust. 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