← Back to Editor

#0C0C0C · #291B1B · #57262C · #852A3C · #BC1F43

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0C0C0C

Ink Black · Black · Jet Black

HEX
#0C0C0C
RGB
rgb(12, 12, 12)
HSL
hsl(0, 0%, 5%)
HSB
hsb(0, 0%, 5%)
CMYK
cmyk(0%, 0%, 0%, 95%)
Oklch
oklch(15.4% 0.000 89.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#291B1B

Crimson · Black · Deep Berry

HEX
#291B1B
RGB
rgb(41, 27, 27)
HSL
hsl(0, 21%, 13%)
HSB
hsb(0, 34%, 16%)
CMYK
cmyk(0%, 34%, 34%, 84%)
Oklch
oklch(24.0% 0.022 18.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#57262C

Crimson · DarkSlateGray · Wine Red

HEX
#57262C
RGB
rgb(87, 38, 44)
HSL
hsl(353, 39%, 25%)
HSB
hsb(353, 56%, 34%)
CMYK
cmyk(0%, 56%, 49%, 66%)
Oklch
oklch(33.9% 0.073 14.1)

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

#852A3C

Crimson · Brown · Wine Red

HEX
#852A3C
RGB
rgb(133, 42, 60)
HSL
hsl(348, 52%, 34%)
HSB
hsb(348, 68%, 52%)
CMYK
cmyk(0%, 68%, 55%, 48%)
Oklch
oklch(42.7% 0.124 12.4)

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

#BC1F43

Vermilion · Crimson · Passion Red

HEX
#BC1F43
RGB
rgb(188, 31, 67)
HSL
hsl(346, 72%, 43%)
HSB
hsb(346, 84%, 74%)
CMYK
cmyk(0%, 84%, 64%, 26%)
Oklch
oklch(51.8% 0.189 15.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0C0C0C
0D0D0D

Analogous

0D0D0D
0C0C0C
0D0D0D

Triadic

0C0C0C
0D0D0D
0D0D0D

Split-Comp.

0C0C0C
0D0D0D
0D0D0D

Tetradic

0C0C0C
0D0D0D
0D0D0D
0D0D0D

Contrast Matrix WCAG 2.1 Contrast

0C0C0C
291B1B
57262C
852A3C
BC1F43
—
1.2
Fail
1.6
Fail
2.2
Fail
3.2
AA Large
1.2
Fail
—
1.4
Fail
1.9
Fail
2.7
Fail
1.6
Fail
1.4
Fail
—
1.4
Fail
2.0
Fail
2.2
Fail
1.9
Fail
1.4
Fail
—
1.4
Fail
3.2
AA Large
2.7
Fail
2.0
Fail
1.4
Fail
—
White BG
19.6AAA
16.6AAA
12.2AAA
8.8AAA
6.1AA
Black BG
1.1Fail
1.3Fail
1.7Fail
2.4Fail
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

0C0C0C
23231B
42412B
5E5D38
78773A

Deuteranopia

0C0C0C
24251B
45482A
636A37
818D38

Tritanopia

0C0C0C
281B1B
552929
803433
B43332

Achromatopsia

0C0C0C
1F1F1F
353535
474747
525252

Shades & Tints Shades & Tints

#0C0C0C

Dark
Light

#291B1B

Dark
Light

#57262C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0c0c0c;
  --color-2: #291b1b;
  --color-3: #57262c;
  --color-4: #852a3c;
  --color-5: #bc1f43;
}

SCSS

$color-1: #0c0c0c;
$color-2: #291b1b;
$color-3: #57262c;
$color-4: #852a3c;
$color-5: #bc1f43;

TAILWIND

colors: {
  'brand-1': '#0c0c0c',
  'brand-2': '#291b1b',
  'brand-3': '#57262c',
  'brand-4': '#852a3c',
  'brand-5': '#bc1f43',
}

RGB Array

[12, 12, 12], [41, 27, 27], [87, 38, 44], [133, 42, 60], [188, 31, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0C0C0C, #291B1B, #57262C, #852A3C, #BC1F43 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: #0c0c0c; --color-2: #291b1b; --color-3: #57262c; --color-4: #852a3c; --color-5: #bc1f43. 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