#2A1E22 + #402B32 + #69232B + #942029 + #FB4013 · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2A1E22

Dark Violet · Black · Raspberry

HEX

#2A1E22

RGB

rgb(42, 30, 34)

HSL

hsl(340, 17%, 14%)

HSB

hsb(340, 29%, 16%)

CMYK

cmyk(0%, 29%, 19%, 84%)

Oklch

oklch(25.1% 0.020 356.8)

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

#402B32

Dark Violet · DarkSlateGray · Raspberry

HEX

#402B32

RGB

rgb(64, 43, 50)

HSL

hsl(340, 20%, 21%)

HSB

hsb(340, 33%, 25%)

CMYK

cmyk(0%, 33%, 22%, 75%)

Oklch

oklch(31.7% 0.033 357.4)

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

#69232B

Crimson · Maroon · Wine Red

HEX

#69232B

RGB

rgb(105, 35, 43)

HSL

hsl(353, 50%, 27%)

HSB

hsb(353, 67%, 41%)

CMYK

cmyk(0%, 67%, 59%, 59%)

Oklch

oklch(36.5% 0.100 16.8)

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

#942029

Vermilion · Brown · Wine Red

HEX

#942029

RGB

rgb(148, 32, 41)

HSL

hsl(355, 64%, 35%)

HSB

hsb(355, 78%, 58%)

CMYK

cmyk(0%, 78%, 72%, 42%)

Oklch

oklch(44.0% 0.151 22.3)

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

#FB4013

Vermilion · OrangeRed · Passion Red

HEX

#FB4013

RGB

rgb(251, 64, 19)

HSL

hsl(12, 97%, 53%)

HSB

hsb(12, 92%, 98%)

CMYK

cmyk(0%, 75%, 92%, 2%)

Oklch

oklch(65.0% 0.228 33.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A1E22

1E2A26

Analogous

2A1E28

2A1E22

2A201E

Triadic

2A1E22

222A1E

1E222A

Split-Comp.

2A1E22

1E2A20

1E282A

Tetradic

2A1E22

282A1E

1E2A26

201E2A

Contrast Matrix WCAG 2.1 Contrast

2A1E22	402B32	69232B	942029	FB4013
—	1.2 Fail	1.4 Fail	1.9 Fail	4.5 AA Large
1.2 Fail	—	1.2 Fail	1.6 Fail	3.6 AA Large
1.4 Fail	1.2 Fail	—	1.3 Fail	3.1 AA Large
1.9 Fail	1.6 Fail	1.3 Fail	—	2.3 Fail
4.5 AA Large	3.6 AA Large	3.1 AA Large	2.3 Fail	—

White BG

16.1AAA

13.0AAA

11.2AAA

8.4AAA

3.6AA Large

Black BG

1.3Fail

1.6Fail

1.9Fail

2.5Fail

5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

252521

373730

4B4A29

626127

AAA81E

Deuteranopia

262621

383A30

4F5429

697126

B5C321

Tritanopia

292020

3F2F2F

662827

8E2525

F22628

Achromatopsia

222222

323232

393939

444444

737373

Shades & Tints Shades & Tints

#2A1E22

Dark

Light

#402B32

Dark

Light

#69232B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a1e22;
  --color-2: #402b32;
  --color-3: #69232b;
  --color-4: #942029;
  --color-5: #fb4013;
}

SCSS

$color-1: #2a1e22;
$color-2: #402b32;
$color-3: #69232b;
$color-4: #942029;
$color-5: #fb4013;

TAILWIND

colors: {
  'brand-1': '#2a1e22',
  'brand-2': '#402b32',
  'brand-3': '#69232b',
  'brand-4': '#942029',
  'brand-5': '#fb4013',
}

RGB Array

[42, 30, 34], [64, 43, 50], [105, 35, 43], [148, 32, 41], [251, 64, 19]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #2A1E22, #402B32, #69232B, #942029, #FB4013 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: #2a1e22; --color-2: #402b32; --color-3: #69232b; --color-4: #942029; --color-5: #fb4013. 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