← Back to Editor

#9E8A8A · #836561 · #6F4B56 · #703B4C · #580F3B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#9E8A8A

Crimson · Gray · Silver Sand

HEX
#9E8A8A
RGB
rgb(158, 138, 138)
HSL
hsl(0, 9%, 58%)
HSB
hsb(0, 13%, 62%)
CMYK
cmyk(0%, 13%, 13%, 38%)
Oklch
oklch(65.1% 0.024 17.8)

Traditional「Crimson」· Paint「Silver Sand」· Creative Urban Concrete

#836561

Crimson · DimGray · Passion Red

HEX
#836561
RGB
rgb(131, 101, 97)
HSL
hsl(7, 15%, 45%)
HSB
hsb(7, 26%, 51%)
CMYK
cmyk(0%, 23%, 26%, 49%)
Oklch
oklch(53.6% 0.039 27.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#6F4B56

Dark Violet · DimGray · Camellia

HEX
#6F4B56
RGB
rgb(111, 75, 86)
HSL
hsl(342, 19%, 36%)
HSB
hsb(342, 32%, 44%)
CMYK
cmyk(0%, 32%, 23%, 56%)
Oklch
oklch(45.6% 0.051 359.4)

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

#703B4C

Dark Violet · DimGray · Camellia

HEX
#703B4C
RGB
rgb(112, 59, 76)
HSL
hsl(341, 31%, 34%)
HSB
hsb(341, 47%, 44%)
CMYK
cmyk(0%, 47%, 32%, 56%)
Oklch
oklch(42.4% 0.077 0.4)

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

#580F3B

Rose Purple · Maroon · Raspberry

HEX
#580F3B
RGB
rgb(88, 15, 59)
HSL
hsl(324, 71%, 20%)
HSB
hsb(324, 83%, 35%)
CMYK
cmyk(0%, 83%, 33%, 65%)
Oklch
oklch(31.6% 0.114 348.8)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9E8A8A
8A9E9E

Analogous

9E8A94
9E8A8A
9E948A

Triadic

9E8A8A
8A9E8A
8A8A9E

Split-Comp.

9E8A8A
8A9E94
8A949E

Tetradic

9E8A8A
949E8A
8A9E9E
948A9E

Contrast Matrix WCAG 2.1 Contrast

9E8A8A
836561
6F4B56
703B4C
580F3B
—
1.6
Fail
2.3
Fail
2.7
Fail
4.2
AA Large
1.6
Fail
—
1.4
Fail
1.7
Fail
2.6
Fail
2.3
Fail
1.4
Fail
—
1.2
Fail
1.8
Fail
2.7
Fail
1.7
Fail
1.2
Fail
—
1.6
Fail
4.2
AA Large
2.6
Fail
1.8
Fail
1.6
Fail
—
White BG
3.3AA Large
5.3AA
7.5AAA
8.7AAA
13.6AAA
Black BG
6.5AA
4.0AA Large
2.8Fail
2.4Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

95958A
767662
5F5F53
595948
383830

Deuteranopia

97988A
787A62
626453
5C6047
3D422E

Tritanopia

9D8A8A
826363
6D5151
6D4544
542826

Achromatopsia

909090
6E6E6E
575757
4D4D4D
2A2A2A

Shades & Tints Shades & Tints

#9E8A8A

Dark
Light

#836561

Dark
Light

#6F4B56

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9e8a8a;
  --color-2: #836561;
  --color-3: #6f4b56;
  --color-4: #703b4c;
  --color-5: #580f3b;
}

SCSS

$color-1: #9e8a8a;
$color-2: #836561;
$color-3: #6f4b56;
$color-4: #703b4c;
$color-5: #580f3b;

TAILWIND

colors: {
  'brand-1': '#9e8a8a',
  'brand-2': '#836561',
  'brand-3': '#6f4b56',
  'brand-4': '#703b4c',
  'brand-5': '#580f3b',
}

RGB Array

[158, 138, 138], [131, 101, 97], [111, 75, 86], [112, 59, 76], [88, 15, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9E8A8A, #836561, #6F4B56, #703B4C, #580F3B is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #9e8a8a; --color-2: #836561; --color-3: #6f4b56; --color-4: #703b4c; --color-5: #580f3b. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 finance, legal, luxury 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