#DC000B + #8BCA00 + #7D8171 + #43443F + #1F1E1E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DC000B

Vermilion · Red · Passion Red

HEX

#DC000B

RGB

rgb(220, 0, 11)

HSL

hsl(357, 100%, 43%)

HSB

hsb(357, 100%, 86%)

CMYK

cmyk(0%, 100%, 95%, 14%)

Oklch

oklch(56.2% 0.230 28.4)

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

#8BCA00

Grass Green · Chartreuse · Forest Green

HEX

#8BCA00

RGB

rgb(139, 202, 0)

HSL

hsl(79, 100%, 40%)

HSB

hsb(79, 100%, 79%)

CMYK

cmyk(31%, 0%, 100%, 21%)

Oklch

oklch(76.7% 0.202 128.7)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#7D8171

Ink Gray · Gray · Warm Gray

HEX

#7D8171

RGB

rgb(125, 129, 113)

HSL

hsl(75, 7%, 47%)

HSB

hsb(75, 12%, 51%)

CMYK

cmyk(3%, 0%, 12%, 49%)

Oklch

oklch(59.5% 0.024 118.5)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#43443F

Dark Cyan · DarkSlateGray · Charcoal

HEX

#43443F

RGB

rgb(67, 68, 63)

HSL

hsl(72, 4%, 26%)

HSB

hsb(72, 7%, 27%)

CMYK

cmyk(1%, 0%, 7%, 73%)

Oklch

oklch(38.4% 0.008 116.0)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#1F1E1E

Ink Black · Black · Dark Stone

HEX

#1F1E1E

RGB

rgb(31, 30, 30)

HSL

hsl(0, 2%, 12%)

HSB

hsb(0, 3%, 12%)

CMYK

cmyk(0%, 3%, 3%, 88%)

Oklch

oklch(23.6% 0.002 17.3)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DC000B

00DBD0

Analogous

DB0079

DC000B

DB6300

Triadic

DC000B

0BDB00

000BDB

Split-Comp.

DC000B

00DB63

0079DB

Tetradic

DC000B

79DB00

00DBD0

6300DB

Contrast Matrix WCAG 2.1 Contrast

DC000B	8BCA00	7D8171	43443F	1F1E1E
—	2.6 Fail	1.3 Fail	1.9 Fail	3.2 AA Large
2.6 Fail	—	2.0 Fail	4.9 AA	8.4 AAA
1.3 Fail	2.0 Fail	—	2.5 Fail	4.2 AA Large
1.9 Fail	4.9 AA	2.5 Fail	—	1.7 Fail
3.2 AA Large	8.4 AAA	4.2 AA Large	1.7 Fail	—

White BG

5.2AA

2.0Fail

4.0AA Large

9.8AAA

16.6AAA

Black BG

4.0AA Large

10.5AAA

5.3AA

2.1Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7D7B08

A6A731

7F7F75

434340

1F1F1E

Deuteranopia

8A9A08

A39E3D

7F7E76

434341

1F1F1E

Tritanopia

D10606

8E5760

7D7879

434141

1F1E1E

Achromatopsia

434343

A0A0A0

7E7E7E

434343

1E1E1E

Shades & Tints Shades & Tints

#DC000B

Dark

Light

#8BCA00

Dark

Light

#7D8171

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dc000b;
  --color-2: #8bca00;
  --color-3: #7d8171;
  --color-4: #43443f;
  --color-5: #1f1e1e;
}

SCSS

$color-1: #dc000b;
$color-2: #8bca00;
$color-3: #7d8171;
$color-4: #43443f;
$color-5: #1f1e1e;

TAILWIND

colors: {
  'brand-1': '#dc000b',
  'brand-2': '#8bca00',
  'brand-3': '#7d8171',
  'brand-4': '#43443f',
  'brand-5': '#1f1e1e',
}

RGB Array

[220, 0, 11], [139, 202, 0], [125, 129, 113], [67, 68, 63], [31, 30, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DC000B, #8BCA00, #7D8171, #43443F, #1F1E1E 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: #dc000b; --color-2: #8bca00; --color-3: #7d8171; --color-4: #43443f; --color-5: #1f1e1e. 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