#8F2329 + #1C2428 + #326E63 + #79884D + #D1A83D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8F2329

Vermilion · Brown · Wine Red

HEX

#8F2329

RGB

rgb(143, 35, 41)

HSL

hsl(357, 61%, 35%)

HSB

hsb(357, 76%, 56%)

CMYK

cmyk(0%, 76%, 71%, 44%)

Oklch

oklch(43.4% 0.143 22.7)

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

#1C2428

Slate Blue · Black · Deep Sea Blue

HEX

#1C2428

RGB

rgb(28, 36, 40)

HSL

hsl(200, 18%, 13%)

HSB

hsb(200, 30%, 16%)

CMYK

cmyk(30%, 10%, 0%, 84%)

Oklch

oklch(25.4% 0.014 229.6)

Traditional「Slate Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#326E63

Mineral Blue · SeaGreen · Mint Ice

HEX

#326E63

RGB

rgb(50, 110, 99)

HSL

hsl(169, 38%, 31%)

HSB

hsb(169, 55%, 43%)

CMYK

cmyk(55%, 0%, 10%, 57%)

Oklch

oklch(49.5% 0.065 179.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#79884D

Grass Green · DimGray · Olive Green

HEX

#79884D

RGB

rgb(121, 136, 77)

HSL

hsl(75, 28%, 42%)

HSB

hsb(75, 43%, 53%)

CMYK

cmyk(11%, 0%, 43%, 47%)

Oklch

oklch(60.0% 0.084 120.7)

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

#D1A83D

Ginger · GoldenRod · Sunflower

HEX

#D1A83D

RGB

rgb(209, 168, 61)

HSL

hsl(43, 62%, 53%)

HSB

hsb(43, 71%, 82%)

CMYK

cmyk(0%, 20%, 71%, 18%)

Oklch

oklch(75.0% 0.131 87.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F2329

23908A

Analogous

90235F

8F2329

905423

Triadic

8F2329

289023

232890

Split-Comp.

8F2329

239054

235F90

Tetradic

8F2329

5F9023

23908A

542390

Contrast Matrix WCAG 2.1 Contrast

8F2329	1C2428	326E63	79884D	D1A83D
—	1.8 Fail	1.5 Fail	2.2 Fail	3.8 AA Large
1.8 Fail	—	2.7 Fail	4.1 AA Large	7.0 AAA
1.5 Fail	2.7 Fail	—	1.5 Fail	2.6 Fail
2.2 Fail	4.1 AA Large	1.5 Fail	—	1.7 Fail
3.8 AA Large	7.0 AAA	2.6 Fail	1.7 Fail	—

White BG

8.6AAA

15.8AAA

5.9AA

3.9AA Large

2.2Fail

Black BG

2.4Fail

1.3Fail

3.5AA Large

5.4AA

9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

605F28

1F2027

4C4D66

7F805B

BFBF57

Deuteranopia

676F27

1F1E27

494466

7F7D5F

C2C55D

Tritanopia

8A2626

1C2626

356868

7A6769

CF6B70

Achromatopsia

444444

222222

5B5B5B

7D7D7D

A8A8A8

Shades & Tints Shades & Tints

#8F2329

Dark

Light

#1C2428

Dark

Light

#326E63

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f2329;
  --color-2: #1c2428;
  --color-3: #326e63;
  --color-4: #79884d;
  --color-5: #d1a83d;
}

SCSS

$color-1: #8f2329;
$color-2: #1c2428;
$color-3: #326e63;
$color-4: #79884d;
$color-5: #d1a83d;

TAILWIND

colors: {
  'brand-1': '#8f2329',
  'brand-2': '#1c2428',
  'brand-3': '#326e63',
  'brand-4': '#79884d',
  'brand-5': '#d1a83d',
}

RGB Array

[143, 35, 41], [28, 36, 40], [50, 110, 99], [121, 136, 77], [209, 168, 61]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F2329, #1C2428, #326E63, #79884D, #D1A83D 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: #8f2329; --color-2: #1c2428; --color-3: #326e63; --color-4: #79884d; --color-5: #d1a83d. 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