← Back to Editor

#3E4C59 · #2B2C30 · #1A1B1F · #5D1628 · #333D49

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

#3E4C59

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#3E4C59
RGB
rgb(62, 76, 89)
HSL
hsl(209, 18%, 30%)
HSB
hsb(209, 30%, 35%)
CMYK
cmyk(30%, 15%, 0%, 65%)
Oklch
oklch(41.0% 0.028 246.6)

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

#2B2C30

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#2B2C30
RGB
rgb(43, 44, 48)
HSL
hsl(228, 5%, 18%)
HSB
hsb(228, 10%, 19%)
CMYK
cmyk(10%, 8%, 0%, 81%)
Oklch
oklch(29.4% 0.007 274.7)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#1A1B1F

Indigo · Black · Dark Stone

HEX
#1A1B1F
RGB
rgb(26, 27, 31)
HSL
hsl(228, 9%, 11%)
HSB
hsb(228, 16%, 12%)
CMYK
cmyk(16%, 13%, 0%, 88%)
Oklch
oklch(22.3% 0.008 274.6)

Traditional「Indigo」· Paint「Dark Stone」· Creative Midnight Shadow

#5D1628

Vermilion · Maroon · Wine Red

HEX
#5D1628
RGB
rgb(93, 22, 40)
HSL
hsl(345, 62%, 23%)
HSB
hsb(345, 76%, 36%)
CMYK
cmyk(0%, 76%, 57%, 64%)
Oklch
oklch(32.6% 0.103 10.1)

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

#333D49

Indigo · DarkSlateGray · Prussian Blue

HEX
#333D49
RGB
rgb(51, 61, 73)
HSL
hsl(213, 18%, 24%)
HSB
hsb(213, 30%, 29%)
CMYK
cmyk(30%, 16%, 0%, 71%)
Oklch
oklch(35.6% 0.025 253.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E4C59
5A4C3F

Analogous

3F5A5A
3E4C59
3F3F5A

Triadic

3E4C59
5A3F4D
4D5A3F

Split-Comp.

3E4C59
5A3F3F
5A5A3F

Tetradic

3E4C59
5A3F5A
5A4C3F
3F5A3F

Contrast Matrix WCAG 2.1 Contrast

3E4C59
2B2C30
1A1B1F
5D1628
333D49
—
1.6
Fail
2.0
Fail
1.5
Fail
1.3
Fail
1.6
Fail
—
1.2
Fail
1.1
Fail
1.3
Fail
2.0
Fail
1.2
Fail
—
1.3
Fail
1.6
Fail
1.5
Fail
1.1
Fail
1.3
Fail
—
1.2
Fail
1.3
Fail
1.3
Fail
1.6
Fail
1.2
Fail
—
White BG
8.8AAA
13.9AAA
17.2AAA
13.0AAA
11.0AAA
Black BG
2.4Fail
1.5Fail
1.2Fail
1.6Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

444456
2B2B2F
1A1A1E
3E3E24
373746

Deuteranopia

434255
2B2B2F
1A1A1E
424823
373645

Tritanopia

3F5353
2B2E2E
1A1D1D
59201F
334443

Achromatopsia

494949
2C2C2C
1B1B1B
2D2D2D
3B3B3B

Shades & Tints Shades & Tints

#3E4C59

Dark
Light

#2B2C30

Dark
Light

#1A1B1F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e4c59;
  --color-2: #2b2c30;
  --color-3: #1a1b1f;
  --color-4: #5d1628;
  --color-5: #333d49;
}

SCSS

$color-1: #3e4c59;
$color-2: #2b2c30;
$color-3: #1a1b1f;
$color-4: #5d1628;
$color-5: #333d49;

TAILWIND

colors: {
  'brand-1': '#3e4c59',
  'brand-2': '#2b2c30',
  'brand-3': '#1a1b1f',
  'brand-4': '#5d1628',
  'brand-5': '#333d49',
}

RGB Array

[62, 76, 89], [43, 44, 48], [26, 27, 31], [93, 22, 40], [51, 61, 73]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3E4C59, #2B2C30, #1A1B1F, #5D1628, #333D49 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: #3e4c59; --color-2: #2b2c30; --color-3: #1a1b1f; --color-4: #5d1628; --color-5: #333d49. 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