← Back to Editor

#372D3B · #214D4F · #565B52 · #855D54 · #B34F4F

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

#372D3B

Dark Plum · DarkSlateGray · Dark Purple

HEX
#372D3B
RGB
rgb(55, 45, 59)
HSL
hsl(283, 13%, 20%)
HSB
hsb(283, 24%, 23%)
CMYK
cmyk(7%, 24%, 0%, 77%)
Oklch
oklch(31.4% 0.028 316.3)

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

#214D4F

Slate Blue · DarkSlateGray · Peacock Green

HEX
#214D4F
RGB
rgb(33, 77, 79)
HSL
hsl(183, 41%, 22%)
HSB
hsb(183, 58%, 31%)
CMYK
cmyk(58%, 3%, 0%, 69%)
Oklch
oklch(39.0% 0.048 199.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#565B52

Ink Gray · DimGray · Charcoal

HEX
#565B52
RGB
rgb(86, 91, 82)
HSL
hsl(93, 5%, 34%)
HSB
hsb(93, 10%, 36%)
CMYK
cmyk(5%, 0%, 10%, 64%)
Oklch
oklch(46.4% 0.016 131.0)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#855D54

Crimson · DimGray · Passion Red

HEX
#855D54
RGB
rgb(133, 93, 84)
HSL
hsl(11, 23%, 43%)
HSB
hsb(11, 37%, 52%)
CMYK
cmyk(0%, 30%, 37%, 48%)
Oklch
oklch(51.8% 0.055 33.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#B34F4F

Crimson · Sienna · Passion Red

HEX
#B34F4F
RGB
rgb(179, 79, 79)
HSL
hsl(0, 40%, 51%)
HSB
hsb(0, 56%, 70%)
CMYK
cmyk(0%, 56%, 56%, 30%)
Oklch
oklch(55.6% 0.131 22.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

372D3B
303A2C

Analogous

2F2C3A
372D3B
3A2C37

Triadic

372D3B
3A362C
2C3A36

Split-Comp.

372D3B
373A2C
2C3A2F

Tetradic

372D3B
3A2F2C
303A2C
2C373A

Contrast Matrix WCAG 2.1 Contrast

372D3B
214D4F
565B52
855D54
B34F4F
—
1.4
Fail
1.9
Fail
2.3
Fail
2.6
Fail
1.4
Fail
—
1.3
Fail
1.6
Fail
1.9
Fail
1.9
Fail
1.3
Fail
—
1.2
Fail
1.4
Fail
2.3
Fail
1.6
Fail
1.2
Fail
—
1.1
Fail
2.6
Fail
1.9
Fail
1.4
Fail
1.1
Fail
—
White BG
13.1AAA
9.4AAA
7.0AA
5.7AA
5.1AA
Black BG
1.6Fail
2.2Fail
3.0AA Large
3.7AA Large
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

333338
34344F
585854
747356
88874F

Deuteranopia

333437
322E4E
585855
767957
8E954F

Tritanopia

373534
234E4E
565656
835858
AE4F4F

Achromatopsia

323232
404040
585858
686868
6D6D6D

Shades & Tints Shades & Tints

#372D3B

Dark
Light

#214D4F

Dark
Light

#565B52

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #372d3b;
  --color-2: #214d4f;
  --color-3: #565b52;
  --color-4: #855d54;
  --color-5: #b34f4f;
}

SCSS

$color-1: #372d3b;
$color-2: #214d4f;
$color-3: #565b52;
$color-4: #855d54;
$color-5: #b34f4f;

TAILWIND

colors: {
  'brand-1': '#372d3b',
  'brand-2': '#214d4f',
  'brand-3': '#565b52',
  'brand-4': '#855d54',
  'brand-5': '#b34f4f',
}

RGB Array

[55, 45, 59], [33, 77, 79], [86, 91, 82], [133, 93, 84], [179, 79, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #372D3B, #214D4F, #565B52, #855D54, #B34F4F 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: #372d3b; --color-2: #214d4f; --color-3: #565b52; --color-4: #855d54; --color-5: #b34f4f. 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