← Back to Editor

#587889 · #495466 · #363645 · #201B26 · #452E36

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

#587889

Slate Blue · SlateGray · Navy Blue

HEX
#587889
RGB
rgb(88, 120, 137)
HSL
hsl(201, 22%, 44%)
HSB
hsb(201, 36%, 54%)
CMYK
cmyk(36%, 12%, 0%, 46%)
Oklch
oklch(55.5% 0.045 231.8)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#495466

Indigo · DarkSlateGray · Prussian Blue

HEX
#495466
RGB
rgb(73, 84, 102)
HSL
hsl(217, 17%, 34%)
HSB
hsb(217, 28%, 40%)
CMYK
cmyk(28%, 18%, 0%, 60%)
Oklch
oklch(44.3% 0.033 260.2)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#363645

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#363645
RGB
rgb(54, 54, 69)
HSL
hsl(240, 12%, 24%)
HSB
hsb(240, 22%, 27%)
CMYK
cmyk(22%, 22%, 0%, 73%)
Oklch
oklch(33.9% 0.026 284.9)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#201B26

Deep Indigo · Black · Dark Purple

HEX
#201B26
RGB
rgb(32, 27, 38)
HSL
hsl(267, 17%, 13%)
HSB
hsb(267, 29%, 15%)
CMYK
cmyk(16%, 29%, 0%, 85%)
Oklch
oklch(23.3% 0.022 305.4)

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

#452E36

Dark Violet · DarkSlateGray · Raspberry

HEX
#452E36
RGB
rgb(69, 46, 54)
HSL
hsl(339, 20%, 23%)
HSB
hsb(339, 33%, 27%)
CMYK
cmyk(0%, 33%, 22%, 73%)
Oklch
oklch(33.1% 0.036 356.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

587889
896958

Analogous

588981
587889
585F89

Triadic

587889
895878
788958

Split-Comp.

587889
89585F
898158

Tetradic

587889
815889
896958
5F8958

Contrast Matrix WCAG 2.1 Contrast

587889
495466
363645
201B26
452E36
—
1.6
Fail
2.5
Fail
3.6
AA Large
2.6
Fail
1.6
Fail
—
1.5
Fail
2.2
Fail
1.6
Fail
2.5
Fail
1.5
Fail
—
1.4
Fail
1.0
Fail
3.6
AA Large
2.2
Fail
1.4
Fail
—
1.4
Fail
2.6
Fail
1.6
Fail
1.0
Fail
1.4
Fail
—
White BG
4.7AA
7.7AAA
11.9AAA
16.9AAA
12.4AAA
Black BG
4.5AA Large
2.7Fail
1.8Fail
1.2Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

666685
4E4E62
363641
1E1E23
3B3B34

Deuteranopia

646284
4D4C61
363641
1E1F23
3C3E34

Tritanopia

5A8281
4A5E5D
363F3E
202121
443332

Achromatopsia

707070
535353
383838
1E1E1E
363636

Shades & Tints Shades & Tints

#587889

Dark
Light

#495466

Dark
Light

#363645

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #587889;
  --color-2: #495466;
  --color-3: #363645;
  --color-4: #201b26;
  --color-5: #452e36;
}

SCSS

$color-1: #587889;
$color-2: #495466;
$color-3: #363645;
$color-4: #201b26;
$color-5: #452e36;

TAILWIND

colors: {
  'brand-1': '#587889',
  'brand-2': '#495466',
  'brand-3': '#363645',
  'brand-4': '#201b26',
  'brand-5': '#452e36',
}

RGB Array

[88, 120, 137], [73, 84, 102], [54, 54, 69], [32, 27, 38], [69, 46, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #587889, #495466, #363645, #201B26, #452E36 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: #587889; --color-2: #495466; --color-3: #363645; --color-4: #201b26; --color-5: #452e36. 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