← Back to Editor

#9B1114 · #7C2223 · #642D2E · #503132 · #35292A

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

#9B1114

Vermilion · DarkRed · Wine Red

HEX
#9B1114
RGB
rgb(155, 17, 20)
HSL
hsl(359, 80%, 34%)
HSB
hsb(359, 89%, 61%)
CMYK
cmyk(0%, 89%, 87%, 39%)
Oklch
oklch(44.1% 0.170 27.2)

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

#7C2223

Crimson · Brown · Wine Red

HEX
#7C2223
RGB
rgb(124, 34, 35)
HSL
hsl(359, 57%, 31%)
HSB
hsb(359, 73%, 49%)
CMYK
cmyk(0%, 73%, 72%, 51%)
Oklch
oklch(39.6% 0.124 24.3)

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

#642D2E

Crimson · DarkOliveGreen · Wine Red

HEX
#642D2E
RGB
rgb(100, 45, 46)
HSL
hsl(359, 38%, 28%)
HSB
hsb(359, 55%, 39%)
CMYK
cmyk(0%, 55%, 54%, 61%)
Oklch
oklch(37.3% 0.080 20.6)

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

#503132

Crimson · DarkSlateGray · Wine Red

HEX
#503132
RGB
rgb(80, 49, 50)
HSL
hsl(358, 24%, 25%)
HSB
hsb(358, 39%, 31%)
CMYK
cmyk(0%, 39%, 38%, 69%)
Oklch
oklch(35.1% 0.045 17.5)

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

#35292A

Crimson · DarkSlateGray · Deep Berry

HEX
#35292A
RGB
rgb(53, 41, 42)
HSL
hsl(355, 13%, 18%)
HSB
hsb(355, 23%, 21%)
CMYK
cmyk(0%, 23%, 21%, 79%)
Oklch
oklch(29.5% 0.018 12.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9B1114
119C9A

Analogous

9C1159
9B1114
9C5411

Triadic

9B1114
149C11
11149C

Split-Comp.

9B1114
119C54
11599C

Tetradic

9B1114
599C11
119C9A
54119C

Contrast Matrix WCAG 2.1 Contrast

9B1114
7C2223
642D2E
503132
35292A
—
1.2
Fail
1.3
Fail
1.4
Fail
1.7
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.4
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
1.2
Fail
1.7
Fail
1.4
Fail
1.3
Fail
1.2
Fail
—
White BG
8.5AAA
10.0AAA
10.7AAA
11.5AAA
14.0AAA
Black BG
2.5Fail
2.1Fail
2.0Fail
1.8Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5F5E13
555423
4C4C2E
434232
30302A

Deuteranopia

677213
5A6123
4F542E
444732
31312A

Tritanopia

941313
782323
612E2E
4E3232
342A2A

Achromatopsia

3B3B3B
3D3D3D
3E3E3E
3A3A3A
2D2D2D

Shades & Tints Shades & Tints

#9B1114

Dark
Light

#7C2223

Dark
Light

#642D2E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9b1114;
  --color-2: #7c2223;
  --color-3: #642d2e;
  --color-4: #503132;
  --color-5: #35292a;
}

SCSS

$color-1: #9b1114;
$color-2: #7c2223;
$color-3: #642d2e;
$color-4: #503132;
$color-5: #35292a;

TAILWIND

colors: {
  'brand-1': '#9b1114',
  'brand-2': '#7c2223',
  'brand-3': '#642d2e',
  'brand-4': '#503132',
  'brand-5': '#35292a',
}

RGB Array

[155, 17, 20], [124, 34, 35], [100, 45, 46], [80, 49, 50], [53, 41, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9B1114, #7C2223, #642D2E, #503132, #35292A 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: #9b1114; --color-2: #7c2223; --color-3: #642d2e; --color-4: #503132; --color-5: #35292a. 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