#3A3A43 + #242625 + #8F2D1A + #B53921 + #DB6327 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3A3A43

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#3A3A43

RGB

rgb(58, 58, 67)

HSL

hsl(240, 7%, 25%)

HSB

hsb(240, 13%, 26%)

CMYK

cmyk(13%, 13%, 0%, 74%)

Oklch

oklch(35.2% 0.015 285.6)

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

#242625

Ink Black · DarkSlateGray · Dark Stone

HEX

#242625

RGB

rgb(36, 38, 37)

HSL

hsl(150, 3%, 15%)

HSB

hsb(150, 5%, 15%)

CMYK

cmyk(5%, 0%, 3%, 85%)

Oklch

oklch(26.6% 0.003 164.8)

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

#8F2D1A

Vermilion · Brown · Wine Red

HEX

#8F2D1A

RGB

rgb(143, 45, 26)

HSL

hsl(10, 69%, 33%)

HSB

hsb(10, 82%, 56%)

CMYK

cmyk(0%, 69%, 82%, 44%)

Oklch

oklch(44.3% 0.136 33.0)

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

#B53921

Vermilion · FireBrick · Passion Red

HEX

#B53921

RGB

rgb(181, 57, 33)

HSL

hsl(10, 69%, 42%)

HSB

hsb(10, 82%, 71%)

CMYK

cmyk(0%, 69%, 82%, 29%)

Oklch

oklch(52.3% 0.164 33.0)

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

#DB6327

Tangerine · Chocolate · Warm Sun

HEX

#DB6327

RGB

rgb(219, 99, 39)

HSL

hsl(20, 71%, 51%)

HSB

hsb(20, 82%, 86%)

CMYK

cmyk(0%, 55%, 82%, 14%)

Oklch

oklch(63.9% 0.166 43.8)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A3A43

44443B

Analogous

3B4044

3A3A43

403B44

Triadic

3A3A43

443B3B

3B443B

Split-Comp.

3A3A43

44403B

40443B

Tetradic

3A3A43

443B40

44443B

3B4440

Contrast Matrix WCAG 2.1 Contrast

3A3A43	242625	8F2D1A	B53921	DB6327
—	1.4 Fail	1.4 Fail	1.9 Fail	3.1 AA Large
1.4 Fail	—	1.9 Fail	2.6 Fail	4.2 AA Large
1.4 Fail	1.9 Fail	—	1.4 Fail	2.3 Fail
1.9 Fail	2.6 Fail	1.4 Fail	—	1.6 Fail
3.1 AA Large	4.2 AA Large	2.3 Fail	1.6 Fail	—

White BG

11.3AAA

15.2AAA

8.2AAA

5.9AA

3.6AA Large

Black BG

1.9Fail

1.4Fail

2.6Fail

3.6AA Large

5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A41

252525

65641F

7F7E27

A7A636

Deuteranopia

3A3A40

252525

6A7220

879028

AEB739

Tritanopia

3A3F3F

242525

8A2223

AF2B2C

D54144

Achromatopsia

3B3B3B

252525

484848

5B5B5B

808080

Shades & Tints Shades & Tints

#3A3A43

Dark

Light

#242625

Dark

Light

#8F2D1A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a3a43;
  --color-2: #242625;
  --color-3: #8f2d1a;
  --color-4: #b53921;
  --color-5: #db6327;
}

SCSS

$color-1: #3a3a43;
$color-2: #242625;
$color-3: #8f2d1a;
$color-4: #b53921;
$color-5: #db6327;

TAILWIND

colors: {
  'brand-1': '#3a3a43',
  'brand-2': '#242625',
  'brand-3': '#8f2d1a',
  'brand-4': '#b53921',
  'brand-5': '#db6327',
}

RGB Array

[58, 58, 67], [36, 38, 37], [143, 45, 26], [181, 57, 33], [219, 99, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3A3A43, #242625, #8F2D1A, #B53921, #DB6327 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: #3a3a43; --color-2: #242625; --color-3: #8f2d1a; --color-4: #b53921; --color-5: #db6327. 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