← Back to Editor

#637E9A · #7B6F87 · #705166 · #613743 · #251829

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

#637E9A

Indigo · SlateGray · Navy Blue

HEX
#637E9A
RGB
rgb(99, 126, 154)
HSL
hsl(211, 22%, 50%)
HSB
hsb(211, 36%, 60%)
CMYK
cmyk(36%, 18%, 0%, 40%)
Oklch
oklch(58.3% 0.053 249.7)

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

#7B6F87

Dark Plum · Gray · Violet

HEX
#7B6F87
RGB
rgb(123, 111, 135)
HSL
hsl(270, 10%, 48%)
HSB
hsb(270, 18%, 53%)
CMYK
cmyk(9%, 18%, 0%, 47%)
Oklch
oklch(56.1% 0.039 307.7)

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

#705166

Rose Purple · DimGray · Eggplant

HEX
#705166
RGB
rgb(112, 81, 102)
HSL
hsl(319, 16%, 38%)
HSB
hsb(319, 28%, 44%)
CMYK
cmyk(0%, 28%, 9%, 56%)
Oklch
oklch(47.5% 0.052 338.8)

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

#613743

Dark Violet · DarkSlateGray · Camellia

HEX
#613743
RGB
rgb(97, 55, 67)
HSL
hsl(343, 28%, 30%)
HSB
hsb(343, 43%, 38%)
CMYK
cmyk(0%, 43%, 31%, 62%)
Oklch
oklch(39.2% 0.062 1.9)

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

#251829

Dark Plum · Black · Dark Purple

HEX
#251829
RGB
rgb(37, 24, 41)
HSL
hsl(286, 26%, 13%)
HSB
hsb(286, 41%, 16%)
CMYK
cmyk(10%, 41%, 0%, 84%)
Oklch
oklch(23.4% 0.037 318.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

637E9A
9C8063

Analogous

639B9C
637E9A
64639C

Triadic

637E9A
9C637F
7F9C63

Split-Comp.

637E9A
9C6463
9B9C63

Tetradic

637E9A
9C639B
9C8063
639C64

Contrast Matrix WCAG 2.1 Contrast

637E9A
7B6F87
705166
613743
251829
—
1.1
Fail
1.6
Fail
2.3
Fail
4.0
AA Large
1.1
Fail
—
1.5
Fail
2.1
Fail
3.6
AA Large
1.6
Fail
1.5
Fail
—
1.4
Fail
2.5
Fail
2.3
Fail
2.1
Fail
1.4
Fail
—
1.7
Fail
4.0
AA Large
3.6
AA Large
2.5
Fail
1.7
Fail
—
White BG
4.2AA Large
4.7AA
6.9AA
9.8AAA
16.9AAA
Black BG
5.0AA
4.5AA Large
3.1AA Large
2.1Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F6F93
767681
636261
4F4E40
1F1F25

Deuteranopia

6D6B92
777780
646760
51543F
202124

Tritanopia

648E8D
7A7D7C
6E5D5C
5F3E3D
242221

Achromatopsia

797979
757575
5D5D5D
454545
1E1E1E

Shades & Tints Shades & Tints

#637E9A

Dark
Light

#7B6F87

Dark
Light

#705166

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #637e9a;
  --color-2: #7b6f87;
  --color-3: #705166;
  --color-4: #613743;
  --color-5: #251829;
}

SCSS

$color-1: #637e9a;
$color-2: #7b6f87;
$color-3: #705166;
$color-4: #613743;
$color-5: #251829;

TAILWIND

colors: {
  'brand-1': '#637e9a',
  'brand-2': '#7b6f87',
  'brand-3': '#705166',
  'brand-4': '#613743',
  'brand-5': '#251829',
}

RGB Array

[99, 126, 154], [123, 111, 135], [112, 81, 102], [97, 55, 67], [37, 24, 41]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #637E9A, #7B6F87, #705166, #613743, #251829 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: #637e9a; --color-2: #7b6f87; --color-3: #705166; --color-4: #613743; --color-5: #251829. 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