← Back to Editor

#37555D · #432C2E · #921817 · #1B1715 · #B50302

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#37555D

Slate Blue · DarkSlateGray · Mint Ice

HEX
#37555D
RGB
rgb(55, 85, 93)
HSL
hsl(193, 26%, 29%)
HSB
hsb(193, 41%, 36%)
CMYK
cmyk(41%, 9%, 0%, 64%)
Oklch
oklch(42.9% 0.038 216.3)

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

#432C2E

Crimson · DarkSlateGray · Wine Red

HEX
#432C2E
RGB
rgb(67, 44, 46)
HSL
hsl(355, 21%, 22%)
HSB
hsb(355, 34%, 26%)
CMYK
cmyk(0%, 34%, 31%, 74%)
Oklch
oklch(32.1% 0.034 13.4)

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

#921817

Vermilion · Brown · Wine Red

HEX
#921817
RGB
rgb(146, 24, 23)
HSL
hsl(0, 73%, 33%)
HSB
hsb(0, 84%, 57%)
CMYK
cmyk(0%, 84%, 84%, 43%)
Oklch
oklch(42.8% 0.157 27.4)

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

#1B1715

Tangerine · Black · Cinnamon

HEX
#1B1715
RGB
rgb(27, 23, 21)
HSL
hsl(20, 13%, 9%)
HSB
hsb(20, 22%, 11%)
CMYK
cmyk(0%, 15%, 22%, 89%)
Oklch
oklch(20.9% 0.008 48.3)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#B50302

Vermilion · DarkRed · Wine Red

HEX
#B50302
RGB
rgb(181, 3, 2)
HSL
hsl(0, 98%, 36%)
HSB
hsb(0, 99%, 71%)
CMYK
cmyk(0%, 98%, 99%, 29%)
Oklch
oklch(48.6% 0.198 29.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

37555D
5D3F37

Analogous

375D52
37555D
37425D

Triadic

37555D
5D3755
555D37

Split-Comp.

37555D
5D3742
5D5237

Tetradic

37555D
52375D
5D3F37
425D37

Contrast Matrix WCAG 2.1 Contrast

37555D
432C2E
921817
1B1715
B50302
—
1.6
Fail
1.1
Fail
2.2
Fail
1.1
Fail
1.6
Fail
—
1.4
Fail
1.4
Fail
1.8
Fail
1.1
Fail
1.4
Fail
—
2.0
Fail
1.3
Fail
2.2
Fail
1.4
Fail
2.0
Fail
—
2.5
Fail
1.1
Fail
1.8
Fail
1.3
Fail
2.5
Fail
—
White BG
8.0AAA
12.8AAA
8.9AAA
17.8AAA
7.1AAA
Black BG
2.6Fail
1.6Fail
2.4Fail
1.2Fail
3.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

44445B
39392E
5D5C17
191915
686602

Deuteranopia

42405B
3A3C2D
646D17
1A1A16
728002

Tritanopia

395A59
422D2D
8C1717
1B1616
AC0202

Achromatopsia

4D4D4D
333333
3C3C3C
181818
383838

Shades & Tints Shades & Tints

#37555D

Dark
Light

#432C2E

Dark
Light

#921817

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #37555d;
  --color-2: #432c2e;
  --color-3: #921817;
  --color-4: #1b1715;
  --color-5: #b50302;
}

SCSS

$color-1: #37555d;
$color-2: #432c2e;
$color-3: #921817;
$color-4: #1b1715;
$color-5: #b50302;

TAILWIND

colors: {
  'brand-1': '#37555d',
  'brand-2': '#432c2e',
  'brand-3': '#921817',
  'brand-4': '#1b1715',
  'brand-5': '#b50302',
}

RGB Array

[55, 85, 93], [67, 44, 46], [146, 24, 23], [27, 23, 21], [181, 3, 2]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #37555D, #432C2E, #921817, #1B1715, #B50302 is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #37555d; --color-2: #432c2e; --color-3: #921817; --color-4: #1b1715; --color-5: #b50302. 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 tech, SaaS, healthcare, eco industries. 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