← Back to Editor

#4D0F37 · #402945 · #333D42 · #4E5742 · #826F53

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

#4D0F37

Rose Purple · DarkSlateGray · Raspberry

HEX
#4D0F37
RGB
rgb(77, 15, 55)
HSL
hsl(321, 67%, 18%)
HSB
hsb(321, 81%, 30%)
CMYK
cmyk(0%, 81%, 29%, 70%)
Oklch
oklch(29.4% 0.102 345.7)

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

#402945

Dark Plum · DarkSlateGray · Eggplant

HEX
#402945
RGB
rgb(64, 41, 69)
HSL
hsl(289, 25%, 22%)
HSB
hsb(289, 41%, 27%)
CMYK
cmyk(7%, 41%, 0%, 73%)
Oklch
oklch(32.1% 0.057 320.3)

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

#333D42

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#333D42
RGB
rgb(51, 61, 66)
HSL
hsl(200, 13%, 23%)
HSB
hsb(200, 23%, 26%)
CMYK
cmyk(23%, 8%, 0%, 74%)
Oklch
oklch(35.3% 0.016 229.4)

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

#4E5742

Grass Green · DarkOliveGreen · Forest Green

HEX
#4E5742
RGB
rgb(78, 87, 66)
HSL
hsl(86, 14%, 30%)
HSB
hsb(86, 24%, 34%)
CMYK
cmyk(10%, 0%, 24%, 66%)
Oklch
oklch(44.2% 0.035 126.7)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#826F53

Ochre · DimGray · Amber Brown

HEX
#826F53
RGB
rgb(130, 111, 83)
HSL
hsl(36, 22%, 42%)
HSB
hsb(36, 36%, 51%)
CMYK
cmyk(0%, 15%, 36%, 49%)
Oklch
oklch(55.2% 0.047 77.1)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4D0F37
0F4D25

Analogous

430F4D
4D0F37
4D0F18

Triadic

4D0F37
374D0F
0F374D

Split-Comp.

4D0F37
184D0F
0F4D43

Tetradic

4D0F37
4D430F
0F4D25
0F184D

Contrast Matrix WCAG 2.1 Contrast

4D0F37
402945
333D42
4E5742
826F53
—
1.1
Fail
1.3
Fail
1.9
Fail
3.0
AA Large
1.1
Fail
—
1.2
Fail
1.7
Fail
2.7
Fail
1.3
Fail
1.2
Fail
—
1.5
Fail
2.3
Fail
1.9
Fail
1.7
Fail
1.5
Fail
—
1.6
Fail
3.0
AA Large
2.7
Fail
2.3
Fail
1.6
Fail
—
White BG
14.6AAA
13.0AAA
11.1AAA
7.6AAA
4.8AA
Black BG
1.4Fail
1.6Fail
1.9Fail
2.8Fail
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

32322D
36363E
373741
525247
7A7A5A

Deuteranopia

363A2B
37393D
373641
515148
7B7C5B

Tritanopia

4A2624
3F3938
334040
4E4B4C
815F60

Achromatopsia

262626
333333
3B3B3B
525252
717171

Shades & Tints Shades & Tints

#4D0F37

Dark
Light

#402945

Dark
Light

#333D42

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4d0f37;
  --color-2: #402945;
  --color-3: #333d42;
  --color-4: #4e5742;
  --color-5: #826f53;
}

SCSS

$color-1: #4d0f37;
$color-2: #402945;
$color-3: #333d42;
$color-4: #4e5742;
$color-5: #826f53;

TAILWIND

colors: {
  'brand-1': '#4d0f37',
  'brand-2': '#402945',
  'brand-3': '#333d42',
  'brand-4': '#4e5742',
  'brand-5': '#826f53',
}

RGB Array

[77, 15, 55], [64, 41, 69], [51, 61, 66], [78, 87, 66], [130, 111, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #4D0F37, #402945, #333D42, #4E5742, #826F53 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: #4d0f37; --color-2: #402945; --color-3: #333d42; --color-4: #4e5742; --color-5: #826f53. 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