← Back to Editor

#2B1F2B · #8B1A2D · #EB152E · #EB8754 · #3C786B

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 LibraryData Visualization

Color Details Color Details

#2B1F2B

Rose Purple · DarkSlateGray · Dark Purple

HEX
#2B1F2B
RGB
rgb(43, 31, 43)
HSL
hsl(300, 16%, 15%)
HSB
hsb(300, 28%, 17%)
CMYK
cmyk(0%, 28%, 0%, 83%)
Oklch
oklch(25.9% 0.028 326.4)

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

#8B1A2D

Vermilion · Brown · Wine Red

HEX
#8B1A2D
RGB
rgb(139, 26, 45)
HSL
hsl(350, 68%, 32%)
HSB
hsb(350, 81%, 55%)
CMYK
cmyk(0%, 81%, 68%, 45%)
Oklch
oklch(41.9% 0.147 17.8)

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

#EB152E

Vermilion · Crimson · Passion Red

HEX
#EB152E
RGB
rgb(235, 21, 46)
HSL
hsl(353, 84%, 50%)
HSB
hsb(353, 91%, 92%)
CMYK
cmyk(0%, 91%, 80%, 8%)
Oklch
oklch(59.8% 0.235 24.5)

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

#EB8754

Apricot · Coral · Warm Sun

HEX
#EB8754
RGB
rgb(235, 135, 84)
HSL
hsl(20, 79%, 63%)
HSB
hsb(20, 64%, 92%)
CMYK
cmyk(0%, 43%, 64%, 8%)
Oklch
oklch(72.2% 0.139 46.7)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#3C786B

Mineral Blue · SeaGreen · Mint Ice

HEX
#3C786B
RGB
rgb(60, 120, 107)
HSL
hsl(167, 33%, 35%)
HSB
hsb(167, 50%, 47%)
CMYK
cmyk(50%, 0%, 11%, 53%)
Oklch
oklch(52.8% 0.066 177.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B1F2B
202C20

Analogous

26202C
2B1F2B
2C2026

Triadic

2B1F2B
2C2C20
202C2C

Split-Comp.

2B1F2B
262C20
202C26

Tetradic

2B1F2B
2C2620
202C20
20262C

Contrast Matrix WCAG 2.1 Contrast

2B1F2B
8B1A2D
EB152E
EB8754
3C786B
—
1.7
Fail
3.5
AA Large
6.1
AA
3.1
AA Large
1.7
Fail
—
2.0
Fail
3.6
AA Large
1.8
Fail
3.5
AA Large
2.0
Fail
—
1.7
Fail
1.1
Fail
6.1
AA
3.6
AA Large
1.7
Fail
—
2.0
Fail
3.1
AA Large
1.8
Fail
1.1
Fail
2.0
Fail
—
White BG
15.7AAA
9.2AAA
4.5AA Large
2.6Fail
5.1AA
Black BG
1.3Fail
2.3Fail
4.7AA
8.1AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

262628
5A5928
8E8C28
C0BF60
56576E

Deuteranopia

272727
616927
9BAB26
C6CD63
534E6F

Tritanopia

2A2625
852524
E02322
E66A6C
3F7171

Achromatopsia

242424
3E3E3E
585858
9F9F9F
656565

Shades & Tints Shades & Tints

#2B1F2B

Dark
Light

#8B1A2D

Dark
Light

#EB152E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b1f2b;
  --color-2: #8b1a2d;
  --color-3: #eb152e;
  --color-4: #eb8754;
  --color-5: #3c786b;
}

SCSS

$color-1: #2b1f2b;
$color-2: #8b1a2d;
$color-3: #eb152e;
$color-4: #eb8754;
$color-5: #3c786b;

TAILWIND

colors: {
  'brand-1': '#2b1f2b',
  'brand-2': '#8b1a2d',
  'brand-3': '#eb152e',
  'brand-4': '#eb8754',
  'brand-5': '#3c786b',
}

RGB Array

[43, 31, 43], [139, 26, 45], [235, 21, 46], [235, 135, 84], [60, 120, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2B1F2B, #8B1A2D, #EB152E, #EB8754, #3C786B is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #2b1f2b; --color-2: #8b1a2d; --color-3: #eb152e; --color-4: #eb8754; --color-5: #3c786b. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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