← Back to Editor

#56574D · #C6BFBF · #900019 · #B92F62 · #130724

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#56574D

Ink Gray · DarkOliveGreen · Charcoal

HEX
#56574D
RGB
rgb(86, 87, 77)
HSL
hsl(66, 6%, 32%)
HSB
hsb(66, 11%, 34%)
CMYK
cmyk(1%, 0%, 11%, 66%)
Oklch
oklch(45.3% 0.016 111.7)

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

#C6BFBF

Silver Gray · Silver · Pearl Gray

HEX
#C6BFBF
RGB
rgb(198, 191, 191)
HSL
hsl(0, 6%, 76%)
HSB
hsb(0, 4%, 78%)
CMYK
cmyk(0%, 4%, 4%, 22%)
Oklch
oklch(81.0% 0.008 17.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#900019

Vermilion · DarkRed · Wine Red

HEX
#900019
RGB
rgb(144, 0, 25)
HSL
hsl(350, 100%, 28%)
HSB
hsb(350, 100%, 56%)
CMYK
cmyk(0%, 100%, 83%, 44%)
Oklch
oklch(41.2% 0.166 23.3)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#B92F62

Dark Violet · MediumVioletRed · Camellia

HEX
#B92F62
RGB
rgb(185, 47, 98)
HSL
hsl(338, 59%, 45%)
HSB
hsb(338, 75%, 73%)
CMYK
cmyk(0%, 75%, 47%, 27%)
Oklch
oklch(53.3% 0.177 3.3)

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

#130724

Deep Indigo · Black · Dark Purple

HEX
#130724
RGB
rgb(19, 7, 36)
HSL
hsl(265, 67%, 8%)
HSB
hsb(265, 81%, 14%)
CMYK
cmyk(47%, 81%, 0%, 86%)
Oklch
oklch(16.8% 0.058 299.3)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

56574D
4E4D56

Analogous

56534D
56574D
51564D

Triadic

56574D
4D5656
564D56

Split-Comp.

56574D
4D5156
534D56

Tetradic

56574D
4D5653
4E4D56
564D51

Contrast Matrix WCAG 2.1 Contrast

56574D
C6BFBF
900019
B92F62
130724
—
4.0
AA Large
1.3
Fail
1.3
Fail
2.6
Fail
4.0
AA Large
—
5.3
AA
3.2
AA Large
10.7
AAA
1.3
Fail
5.3
AA
—
1.7
Fail
2.0
Fail
1.3
Fail
3.2
AA Large
1.7
Fail
—
3.4
AA Large
2.6
Fail
10.7
AAA
2.0
Fail
3.4
AA Large
—
White BG
7.3AAA
1.8Fail
9.5AAA
5.8AA
19.4AAA
Black BG
2.9Fail
11.6AAA
2.2Fail
3.6AA Large
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

56564F
C3C3BF
525013
7D7C56
0E0E1D

Deuteranopia

565650
C3C4BF
5A6512
859053
0F0F1B

Tritanopia

565152
C6BFBF
890E0D
B24C4A
121716

Achromatopsia

565656
C1C1C1
2E2E2E
5E5E5E
0E0E0E

Shades & Tints Shades & Tints

#56574D

Dark
Light

#C6BFBF

Dark
Light

#900019

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #56574d;
  --color-2: #c6bfbf;
  --color-3: #900019;
  --color-4: #b92f62;
  --color-5: #130724;
}

SCSS

$color-1: #56574d;
$color-2: #c6bfbf;
$color-3: #900019;
$color-4: #b92f62;
$color-5: #130724;

TAILWIND

colors: {
  'brand-1': '#56574d',
  'brand-2': '#c6bfbf',
  'brand-3': '#900019',
  'brand-4': '#b92f62',
  'brand-5': '#130724',
}

RGB Array

[86, 87, 77], [198, 191, 191], [144, 0, 25], [185, 47, 98], [19, 7, 36]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #56574D, #C6BFBF, #900019, #B92F62, #130724 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #56574d; --color-2: #c6bfbf; --color-3: #900019; --color-4: #b92f62; --color-5: #130724. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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. 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