#96222B + #642B32 + #1A3A2D + #7A6530 + #00080B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#96222B

Vermilion · Brown · Wine Red

HEX

#96222B

RGB

rgb(150, 34, 43)

HSL

hsl(355, 63%, 36%)

HSB

hsb(355, 77%, 59%)

CMYK

cmyk(0%, 77%, 71%, 41%)

Oklch

oklch(44.6% 0.151 22.1)

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

#642B32

Crimson · Brown · Wine Red

HEX

#642B32

RGB

rgb(100, 43, 50)

HSL

hsl(353, 40%, 28%)

HSB

hsb(353, 57%, 39%)

CMYK

cmyk(0%, 57%, 50%, 61%)

Oklch

oklch(37.0% 0.083 14.4)

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

#1A3A2D

Mineral Blue · DarkSlateGray · Dark Green

HEX

#1A3A2D

RGB

rgb(26, 58, 45)

HSL

hsl(156, 38%, 16%)

HSB

hsb(156, 55%, 23%)

CMYK

cmyk(55%, 0%, 22%, 77%)

Oklch

oklch(31.9% 0.045 165.2)

Traditional「Mineral Blue」· Paint「Dark Green」· Creative Blush Sunrise

#7A6530

Ochre · DarkOliveGreen · Honey Gold

HEX

#7A6530

RGB

rgb(122, 101, 48)

HSL

hsl(43, 44%, 33%)

HSB

hsb(43, 61%, 48%)

CMYK

cmyk(0%, 17%, 61%, 52%)

Oklch

oklch(51.6% 0.076 87.9)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#00080B

Lake Blue · Black · Peacock Green

HEX

#00080B

RGB

rgb(0, 8, 11)

HSL

hsl(196, 100%, 2%)

HSB

hsb(196, 100%, 4%)

CMYK

cmyk(100%, 27%, 0%, 96%)

Oklch

oklch(12.4% 0.022 213.9)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

96222B

22968C

Analogous

962265

96222B

965222

Triadic

96222B

2C9622

222C96

Split-Comp.

96222B

229652

226596

Tetradic

96222B

659622

22968C

522296

Contrast Matrix WCAG 2.1 Contrast

96222B	642B32	1A3A2D	7A6530	00080B
—	1.3 Fail	1.5 Fail	1.5 Fail	2.5 Fail
1.3 Fail	—	1.1 Fail	1.9 Fail	1.9 Fail
1.5 Fail	1.1 Fail	—	2.2 Fail	1.6 Fail
1.5 Fail	1.9 Fail	2.2 Fail	—	3.6 AA Large
2.5 Fail	1.9 Fail	1.6 Fail	3.6 AA Large	—

White BG

8.2AAA

10.9AAA

12.4AAA

5.6AA

20.2AAA

Black BG

2.6Fail

1.9Fail

1.7Fail

3.7AA Large

1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

646329

4B4B30

282830

71713D

03040A

Deuteranopia

6B7328

4F5330

262431

727440

03020A

Tritanopia

902727

612F2F

1C3333

794749

000A0A

Achromatopsia

464646

3D3D3D

2F2F2F

656565

060606

Shades & Tints Shades & Tints

#96222B

Dark

Light

#642B32

Dark

Light

#1A3A2D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #96222b;
  --color-2: #642b32;
  --color-3: #1a3a2d;
  --color-4: #7a6530;
  --color-5: #00080b;
}

SCSS

$color-1: #96222b;
$color-2: #642b32;
$color-3: #1a3a2d;
$color-4: #7a6530;
$color-5: #00080b;

TAILWIND

colors: {
  'brand-1': '#96222b',
  'brand-2': '#642b32',
  'brand-3': '#1a3a2d',
  'brand-4': '#7a6530',
  'brand-5': '#00080b',
}

RGB Array

[150, 34, 43], [100, 43, 50], [26, 58, 45], [122, 101, 48], [0, 8, 11]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #96222B, #642B32, #1A3A2D, #7A6530, #00080B 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: #96222b; --color-2: #642b32; --color-3: #1a3a2d; --color-4: #7a6530; --color-5: #00080b. 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