← Back to Editor

#8F322F · #794754 · #6F2422 · #5F2C3A · #5A1614

dark

A 5-color dark 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

#8F322F

Crimson · Brown · Wine Red

HEX
#8F322F
RGB
rgb(143, 50, 47)
HSL
hsl(2, 51%, 37%)
HSB
hsb(2, 67%, 56%)
CMYK
cmyk(0%, 65%, 67%, 44%)
Oklch
oklch(45.2% 0.127 25.4)

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

#794754

Dark Violet · DimGray · Camellia

HEX
#794754
RGB
rgb(121, 71, 84)
HSL
hsl(344, 26%, 38%)
HSB
hsb(344, 41%, 47%)
CMYK
cmyk(0%, 41%, 31%, 53%)
Oklch
oklch(46.1% 0.070 3.4)

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

#6F2422

Crimson · Maroon · Wine Red

HEX
#6F2422
RGB
rgb(111, 36, 34)
HSL
hsl(2, 53%, 28%)
HSB
hsb(2, 69%, 44%)
CMYK
cmyk(0%, 68%, 69%, 56%)
Oklch
oklch(37.5% 0.107 25.2)

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

#5F2C3A

Dark Violet · DarkSlateGray · Camellia

HEX
#5F2C3A
RGB
rgb(95, 44, 58)
HSL
hsl(344, 37%, 27%)
HSB
hsb(344, 54%, 37%)
CMYK
cmyk(0%, 54%, 39%, 63%)
Oklch
oklch(36.6% 0.076 4.1)

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

#5A1614

Vermilion · Maroon · Wine Red

HEX
#5A1614
RGB
rgb(90, 22, 20)
HSL
hsl(2, 64%, 22%)
HSB
hsb(2, 78%, 35%)
CMYK
cmyk(0%, 76%, 78%, 65%)
Oklch
oklch(31.5% 0.100 26.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F322F
2E8B8E

Analogous

8E2E5B
8F322F
8E622E

Triadic

8F322F
2E8E31
312E8E

Split-Comp.

8F322F
2E8E62
2E5B8E

Tetradic

8F322F
5B8E2E
2E8B8E
622E8E

Contrast Matrix WCAG 2.1 Contrast

8F322F
794754
6F2422
5F2C3A
5A1614
—
1.1
Fail
1.4
Fail
1.4
Fail
1.7
Fail
1.1
Fail
—
1.5
Fail
1.5
Fail
1.8
Fail
1.4
Fail
1.5
Fail
—
1.0
Fail
1.3
Fail
1.4
Fail
1.5
Fail
1.0
Fail
—
1.2
Fail
1.7
Fail
1.8
Fail
1.3
Fail
1.2
Fail
—
White BG
7.9AAA
7.4AAA
10.8AAA
11.0AAA
13.5AAA
Black BG
2.7Fail
2.8Fail
2.0Fail
1.9Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

676630
636351
4F4E22
494837
3D3C14

Deuteranopia

6C7330
666A50
535823
4C5036
414615

Tritanopia

8A3030
764E4E
6B2323
5C3433
571515

Achromatopsia

4D4D4D
575757
3A3A3A
3D3D3D
2A2A2A

Shades & Tints Shades & Tints

#8F322F

Dark
Light

#794754

Dark
Light

#6F2422

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f322f;
  --color-2: #794754;
  --color-3: #6f2422;
  --color-4: #5f2c3a;
  --color-5: #5a1614;
}

SCSS

$color-1: #8f322f;
$color-2: #794754;
$color-3: #6f2422;
$color-4: #5f2c3a;
$color-5: #5a1614;

TAILWIND

colors: {
  'brand-1': '#8f322f',
  'brand-2': '#794754',
  'brand-3': '#6f2422',
  'brand-4': '#5f2c3a',
  'brand-5': '#5a1614',
}

RGB Array

[143, 50, 47], [121, 71, 84], [111, 36, 34], [95, 44, 58], [90, 22, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #8F322F, #794754, #6F2422, #5F2C3A, #5A1614 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: #8f322f; --color-2: #794754; --color-3: #6f2422; --color-4: #5f2c3a; --color-5: #5a1614. 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 dark-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