← Back to Editor

#5C5F67 · #5C4C61 · #5B395C · #5B2656 · #5A1350

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#5C5F67

Ink Gray · DimGray · Charcoal

HEX
#5C5F67
RGB
rgb(92, 95, 103)
HSL
hsl(224, 6%, 38%)
HSB
hsb(224, 11%, 40%)
CMYK
cmyk(11%, 8%, 0%, 60%)
Oklch
oklch(48.6% 0.013 269.4)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#5C4C61

Dark Plum · DimGray · Eggplant

HEX
#5C4C61
RGB
rgb(92, 76, 97)
HSL
hsl(286, 12%, 34%)
HSB
hsb(286, 22%, 38%)
CMYK
cmyk(5%, 22%, 0%, 62%)
Oklch
oklch(44.1% 0.039 318.1)

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

#5B395C

Dark Plum · DarkSlateBlue · Eggplant

HEX
#5B395C
RGB
rgb(91, 57, 92)
HSL
hsl(298, 23%, 29%)
HSB
hsb(298, 38%, 36%)
CMYK
cmyk(1%, 38%, 0%, 64%)
Oklch
oklch(39.8% 0.072 325.8)

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

#5B2656

Rose Purple · DarkSlateGray · Eggplant

HEX
#5B2656
RGB
rgb(91, 38, 86)
HSL
hsl(306, 41%, 25%)
HSB
hsb(306, 58%, 36%)
CMYK
cmyk(0%, 58%, 5%, 64%)
Oklch
oklch(36.3% 0.102 331.2)

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

#5A1350

Rose Purple · Purple · Eggplant

HEX
#5A1350
RGB
rgb(90, 19, 80)
HSL
hsl(308, 65%, 21%)
HSB
hsb(308, 79%, 35%)
CMYK
cmyk(0%, 79%, 11%, 65%)
Oklch
oklch(33.5% 0.125 334.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C5F67
67645B

Analogous

5B6467
5C5F67
5E5B67

Triadic

5C5F67
675B5E
5E675B

Split-Comp.

5C5F67
675E5B
64675B

Tetradic

5C5F67
675B64
67645B
5B675E

Contrast Matrix WCAG 2.1 Contrast

5C5F67
5C4C61
5B395C
5B2656
5A1350
—
1.2
Fail
1.5
Fail
1.8
Fail
2.0
Fail
1.2
Fail
—
1.2
Fail
1.4
Fail
1.6
Fail
1.5
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.8
Fail
1.4
Fail
1.2
Fail
—
1.1
Fail
2.0
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
White BG
6.4AA
7.9AAA
9.6AAA
11.3AAA
12.8AAA
Black BG
3.3AA Large
2.7Fail
2.2Fail
1.9Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5D65
55555C
4C4C54
44444A
3B3B41

Deuteranopia

5D5D65
56575B
4E5151
474B48
3F453E

Tritanopia

5C6463
5B5857
594D4B
58413F
563633

Achromatopsia

5F5F5F
535353
474747
3B3B3B
2F2F2F

Shades & Tints Shades & Tints

#5C5F67

Dark
Light

#5C4C61

Dark
Light

#5B395C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c5f67;
  --color-2: #5c4c61;
  --color-3: #5b395c;
  --color-4: #5b2656;
  --color-5: #5a1350;
}

SCSS

$color-1: #5c5f67;
$color-2: #5c4c61;
$color-3: #5b395c;
$color-4: #5b2656;
$color-5: #5a1350;

TAILWIND

colors: {
  'brand-1': '#5c5f67',
  'brand-2': '#5c4c61',
  'brand-3': '#5b395c',
  'brand-4': '#5b2656',
  'brand-5': '#5a1350',
}

RGB Array

[92, 95, 103], [92, 76, 97], [91, 57, 92], [91, 38, 86], [90, 19, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C5F67, #5C4C61, #5B395C, #5B2656, #5A1350 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: #5c5f67; --color-2: #5c4c61; --color-3: #5b395c; --color-4: #5b2656; --color-5: #5a1350. 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