← Back to Editor

#82658F · #847B87 · #658F78 · #4EA391 · #442152

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

#82658F

Dark Plum · Gray · Violet

HEX
#82658F
RGB
rgb(130, 101, 143)
HSL
hsl(281, 17%, 48%)
HSB
hsb(281, 29%, 56%)
CMYK
cmyk(9%, 29%, 0%, 44%)
Oklch
oklch(55.1% 0.072 315.2)

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

#847B87

Ash · Gray · Warm Gray

HEX
#847B87
RGB
rgb(132, 123, 135)
HSL
hsl(285, 5%, 51%)
HSB
hsb(285, 9%, 53%)
CMYK
cmyk(2%, 9%, 0%, 47%)
Oklch
oklch(59.5% 0.021 317.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#658F78

Celadon · SlateGray · Olive Green

HEX
#658F78
RGB
rgb(101, 143, 120)
HSL
hsl(147, 17%, 48%)
HSB
hsb(147, 29%, 56%)
CMYK
cmyk(29%, 0%, 16%, 44%)
Oklch
oklch(61.2% 0.058 160.1)

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

#4EA391

Mineral Blue · CadetBlue · Mint Ice

HEX
#4EA391
RGB
rgb(78, 163, 145)
HSL
hsl(167, 35%, 47%)
HSB
hsb(167, 52%, 64%)
CMYK
cmyk(52%, 0%, 11%, 36%)
Oklch
oklch(65.7% 0.087 177.7)

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

#442152

Dark Plum · DarkSlateGray · Eggplant

HEX
#442152
RGB
rgb(68, 33, 82)
HSL
hsl(283, 43%, 23%)
HSB
hsb(283, 60%, 32%)
CMYK
cmyk(17%, 60%, 0%, 68%)
Oklch
oklch(31.9% 0.092 315.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

82658F
738F66

Analogous

6D668F
82658F
8F6688

Triadic

82658F
8F8266
668F82

Split-Comp.

82658F
888F66
668F6D

Tetradic

82658F
8F6D66
738F66
66888F

Contrast Matrix WCAG 2.1 Contrast

82658F
847B87
658F78
4EA391
442152
—
1.2
Fail
1.4
Fail
1.7
Fail
2.7
Fail
1.2
Fail
—
1.1
Fail
1.4
Fail
3.3
AA Large
1.4
Fail
1.1
Fail
—
1.2
Fail
3.6
AA Large
1.7
Fail
1.4
Fail
1.2
Fail
—
4.4
AA Large
2.7
Fail
3.3
AA Large
3.6
AA Large
4.4
AA Large
—
White BG
5.0AA
4.1AA Large
3.6AA Large
3.0AA Large
13.2AAA
Black BG
4.2AA Large
5.2AA
5.8AA
7.0AA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

757585
808084
77787E
737495
353546

Deuteranopia

777982
818183
75727F
6E6896
373943

Tritanopia

817D7B
848281
678283
52999A
423D3B

Achromatopsia

727272
7F7F7F
808080
888888
313131

Shades & Tints Shades & Tints

#82658F

Dark
Light

#847B87

Dark
Light

#658F78

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #82658f;
  --color-2: #847b87;
  --color-3: #658f78;
  --color-4: #4ea391;
  --color-5: #442152;
}

SCSS

$color-1: #82658f;
$color-2: #847b87;
$color-3: #658f78;
$color-4: #4ea391;
$color-5: #442152;

TAILWIND

colors: {
  'brand-1': '#82658f',
  'brand-2': '#847b87',
  'brand-3': '#658f78',
  'brand-4': '#4ea391',
  'brand-5': '#442152',
}

RGB Array

[130, 101, 143], [132, 123, 135], [101, 143, 120], [78, 163, 145], [68, 33, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #82658F, #847B87, #658F78, #4EA391, #442152 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: #82658f; --color-2: #847b87; --color-3: #658f78; --color-4: #4ea391; --color-5: #442152. 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