← Back to Editor

#8F35F0 · #92A280 · #87888A · #7C7585 · #6B6E68

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

#8F35F0

Deep Indigo · DarkOrchid · Violet

HEX
#8F35F0
RGB
rgb(143, 53, 240)
HSL
hsl(269, 86%, 57%)
HSB
hsb(269, 78%, 94%)
CMYK
cmyk(40%, 78%, 0%, 6%)
Oklch
oklch(56.0% 0.256 299.6)

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

#92A280

Grass Green · DarkSeaGreen · Olive Green

HEX
#92A280
RGB
rgb(146, 162, 128)
HSL
hsl(88, 15%, 57%)
HSB
hsb(88, 21%, 64%)
CMYK
cmyk(10%, 0%, 21%, 36%)
Oklch
oklch(69.0% 0.052 128.2)

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

#87888A

Ash · Gray · Warm Gray

HEX
#87888A
RGB
rgb(135, 136, 138)
HSL
hsl(220, 1%, 54%)
HSB
hsb(220, 2%, 54%)
CMYK
cmyk(2%, 1%, 0%, 46%)
Oklch
oklch(62.7% 0.003 264.5)

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

#7C7585

Ink Gray · Gray · Warm Gray

HEX
#7C7585
RGB
rgb(124, 117, 133)
HSL
hsl(266, 6%, 49%)
HSB
hsb(266, 12%, 52%)
CMYK
cmyk(7%, 12%, 0%, 48%)
Oklch
oklch(57.4% 0.026 305.3)

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

#6B6E68

Ink Gray · DimGray · Warm Gray

HEX
#6B6E68
RGB
rgb(107, 110, 104)
HSL
hsl(90, 3%, 42%)
HSB
hsb(90, 5%, 43%)
CMYK
cmyk(3%, 0%, 5%, 57%)
Oklch
oklch(53.4% 0.010 128.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F35F0
94F033

Analogous

3336F0
8F35F0
ED33F0

Triadic

8F35F0
F08E33
33F08E

Split-Comp.

8F35F0
F0ED33
36F033

Tetradic

8F35F0
F03336
94F033
33F0ED

Contrast Matrix WCAG 2.1 Contrast

8F35F0
92A280
87888A
7C7585
6B6E68
—
2.0
Fail
1.5
Fail
1.2
Fail
1.0
Fail
2.0
Fail
—
1.3
Fail
1.6
Fail
1.9
Fail
1.5
Fail
1.3
Fail
—
1.2
Fail
1.5
Fail
1.2
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
1.0
Fail
1.9
Fail
1.5
Fail
1.2
Fail
—
White BG
5.3AA
2.7Fail
3.5AA Large
4.4AA Large
5.2AA
Black BG
3.9AA Large
7.7AAA
5.9AA
4.7AA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

6867C3
999988
87878A
797981
6C6C69

Deuteranopia

6D74B8
98978A
878789
797A80
6C6C6A

Tritanopia

8B9F97
938F90
878989
7C7E7D
6B6B6B

Achromatopsia

656565
999999
888888
797979
6C6C6C

Shades & Tints Shades & Tints

#8F35F0

Dark
Light

#92A280

Dark
Light

#87888A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f35f0;
  --color-2: #92a280;
  --color-3: #87888a;
  --color-4: #7c7585;
  --color-5: #6b6e68;
}

SCSS

$color-1: #8f35f0;
$color-2: #92a280;
$color-3: #87888a;
$color-4: #7c7585;
$color-5: #6b6e68;

TAILWIND

colors: {
  'brand-1': '#8f35f0',
  'brand-2': '#92a280',
  'brand-3': '#87888a',
  'brand-4': '#7c7585',
  'brand-5': '#6b6e68',
}

RGB Array

[143, 53, 240], [146, 162, 128], [135, 136, 138], [124, 117, 133], [107, 110, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F35F0, #92A280, #87888A, #7C7585, #6B6E68 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: #8f35f0; --color-2: #92a280; --color-3: #87888a; --color-4: #7c7585; --color-5: #6b6e68. 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