← Back to Editor

#3B2537 · #48364F · #4C6366 · #5F7A65 · #849C6D

dark

A 5-color dark 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

#3B2537

Rose Purple · DarkSlateGray · Dark Purple

HEX
#3B2537
RGB
rgb(59, 37, 55)
HSL
hsl(311, 23%, 19%)
HSB
hsb(311, 37%, 23%)
CMYK
cmyk(0%, 37%, 7%, 77%)
Oklch
oklch(29.9% 0.044 333.3)

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

#48364F

Dark Plum · DarkSlateGray · Eggplant

HEX
#48364F
RGB
rgb(72, 54, 79)
HSL
hsl(283, 19%, 26%)
HSB
hsb(283, 32%, 31%)
CMYK
cmyk(9%, 32%, 0%, 69%)
Oklch
oklch(36.3% 0.048 316.3)

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

#4C6366

Slate Blue · DimGray · Mint Ice

HEX
#4C6366
RGB
rgb(76, 99, 102)
HSL
hsl(187, 15%, 35%)
HSB
hsb(187, 25%, 40%)
CMYK
cmyk(25%, 3%, 0%, 60%)
Oklch
oklch(48.2% 0.028 206.1)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#5F7A65

Celadon · DimGray · Olive Green

HEX
#5F7A65
RGB
rgb(95, 122, 101)
HSL
hsl(133, 12%, 43%)
HSB
hsb(133, 22%, 48%)
CMYK
cmyk(22%, 0%, 17%, 52%)
Oklch
oklch(55.2% 0.045 151.4)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#849C6D

Celadon · Gray · Olive Green

HEX
#849C6D
RGB
rgb(132, 156, 109)
HSL
hsl(91, 19%, 52%)
HSB
hsb(91, 30%, 61%)
CMYK
cmyk(15%, 0%, 30%, 39%)
Oklch
oklch(66.2% 0.072 130.2)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3B2537
253C29

Analogous

35253C
3B2537
3C252C

Triadic

3B2537
383C25
25383C

Split-Comp.

3B2537
2C3C25
253C35

Tetradic

3B2537
3C3525
253C29
252C3C

Contrast Matrix WCAG 2.1 Contrast

3B2537
48364F
4C6366
5F7A65
849C6D
—
1.3
Fail
2.2
Fail
3.0
Fail
4.6
AA
1.3
Fail
—
1.7
Fail
2.3
Fail
3.6
AA Large
2.2
Fail
1.7
Fail
—
1.4
Fail
2.1
Fail
3.0
Fail
2.3
Fail
1.4
Fail
—
1.6
Fail
4.6
AA
3.6
AA Large
2.1
Fail
1.6
Fail
—
White BG
13.9AAA
11.0AAA
6.4AA
4.7AA
3.0AA Large
Black BG
1.5Fail
1.9Fail
3.3AA Large
4.5AA Large
7.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

313133
404049
565665
6B6B6A
8E8F78

Deuteranopia

333432
414348
555365
69676B
8D8B7B

Tritanopia

3A2F2E
474443
4D6565
606E6F
858183

Achromatopsia

2E2E2E
3E3E3E
5C5C5C
707070
8F8F8F

Shades & Tints Shades & Tints

#3B2537

Dark
Light

#48364F

Dark
Light

#4C6366

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3b2537;
  --color-2: #48364f;
  --color-3: #4c6366;
  --color-4: #5f7a65;
  --color-5: #849c6d;
}

SCSS

$color-1: #3b2537;
$color-2: #48364f;
$color-3: #4c6366;
$color-4: #5f7a65;
$color-5: #849c6d;

TAILWIND

colors: {
  'brand-1': '#3b2537',
  'brand-2': '#48364f',
  'brand-3': '#4c6366',
  'brand-4': '#5f7a65',
  'brand-5': '#849c6d',
}

RGB Array

[59, 37, 55], [72, 54, 79], [76, 99, 102], [95, 122, 101], [132, 156, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #3B2537, #48364F, #4C6366, #5F7A65, #849C6D 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: #3b2537; --color-2: #48364f; --color-3: #4c6366; --color-4: #5f7a65; --color-5: #849c6d. 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 dark-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