← Back to Editor

#2C2537 · #733321 · #C93131 · #8C3149 · #BB9C81

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

#2C2537

Deep Indigo · DarkSlateGray · Dark Purple

HEX
#2C2537
RGB
rgb(44, 37, 55)
HSL
hsl(263, 20%, 18%)
HSB
hsb(263, 33%, 22%)
CMYK
cmyk(20%, 33%, 0%, 78%)
Oklch
oklch(28.0% 0.034 302.1)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#733321

Crimson · Brown · Wine Red

HEX
#733321
RGB
rgb(115, 51, 33)
HSL
hsl(13, 55%, 29%)
HSB
hsb(13, 71%, 45%)
CMYK
cmyk(0%, 56%, 71%, 55%)
Oklch
oklch(40.4% 0.095 36.6)

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

#C93131

Vermilion · FireBrick · Passion Red

HEX
#C93131
RGB
rgb(201, 49, 49)
HSL
hsl(0, 61%, 49%)
HSB
hsb(0, 76%, 79%)
CMYK
cmyk(0%, 76%, 76%, 21%)
Oklch
oklch(55.2% 0.189 26.0)

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

#8C3149

Dark Violet · Brown · Camellia

HEX
#8C3149
RGB
rgb(140, 49, 73)
HSL
hsl(344, 48%, 37%)
HSB
hsb(344, 65%, 55%)
CMYK
cmyk(0%, 65%, 48%, 45%)
Oklch
oklch(45.1% 0.125 7.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#BB9C81

Apricot · Tan · Warm Sun

HEX
#BB9C81
RGB
rgb(187, 156, 129)
HSL
hsl(28, 30%, 62%)
HSB
hsb(28, 31%, 73%)
CMYK
cmyk(0%, 17%, 31%, 27%)
Oklch
oklch(71.4% 0.053 62.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2C2537
303725

Analogous

252737
2C2537
352537

Triadic

2C2537
372C25
25372C

Split-Comp.

2C2537
373525
273725

Tetradic

2C2537
372527
303725
253735

Contrast Matrix WCAG 2.1 Contrast

2C2537
733321
C93131
8C3149
BB9C81
—
1.6
Fail
2.8
Fail
1.9
Fail
5.7
AA
1.6
Fail
—
1.8
Fail
1.2
Fail
3.7
AA Large
2.8
Fail
1.8
Fail
—
1.5
Fail
2.1
Fail
1.9
Fail
1.2
Fail
1.5
Fail
—
3.1
AA Large
5.7
AA
3.7
AA Large
2.1
Fail
3.1
AA Large
—
White BG
14.7AAA
9.4AAA
5.3AA
7.9AAA
2.6Fail
Black BG
1.4Fail
2.2Fail
4.0AA Large
2.7Fail
8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

292933
575725
878631
656443
AEAD88

Deuteranopia

292A32
5B6026
909B31
6A7142
AFB289

Tritanopia

2C2F2E
70292A
C13131
873F3E
B98D8E

Achromatopsia

292929
444444
5E5E5E
4F4F4F
A2A2A2

Shades & Tints Shades & Tints

#2C2537

Dark
Light

#733321

Dark
Light

#C93131

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2c2537;
  --color-2: #733321;
  --color-3: #c93131;
  --color-4: #8c3149;
  --color-5: #bb9c81;
}

SCSS

$color-1: #2c2537;
$color-2: #733321;
$color-3: #c93131;
$color-4: #8c3149;
$color-5: #bb9c81;

TAILWIND

colors: {
  'brand-1': '#2c2537',
  'brand-2': '#733321',
  'brand-3': '#c93131',
  'brand-4': '#8c3149',
  'brand-5': '#bb9c81',
}

RGB Array

[44, 37, 55], [115, 51, 33], [201, 49, 49], [140, 49, 73], [187, 156, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2C2537, #733321, #C93131, #8C3149, #BB9C81 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: #2c2537; --color-2: #733321; --color-3: #c93131; --color-4: #8c3149; --color-5: #bb9c81. 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