#8D1816 + #D24605 + #404E4F + #A9B64D + #809DA0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8D1816

Vermilion · DarkRed · Wine Red

HEX

#8D1816

RGB

rgb(141, 24, 22)

HSL

hsl(1, 73%, 32%)

HSB

hsb(1, 84%, 55%)

CMYK

cmyk(0%, 83%, 84%, 45%)

Oklch

oklch(41.8% 0.152 27.6)

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

#D24605

Tangerine · Chocolate · Amber Brown

HEX

#D24605

RGB

rgb(210, 70, 5)

HSL

hsl(19, 95%, 42%)

HSB

hsb(19, 98%, 82%)

CMYK

cmyk(0%, 67%, 98%, 18%)

Oklch

oklch(58.6% 0.186 38.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#404E4F

Slate Blue · DarkSlateGray · Mint Ice

HEX

#404E4F

RGB

rgb(64, 78, 79)

HSL

hsl(184, 10%, 28%)

HSB

hsb(184, 19%, 31%)

CMYK

cmyk(19%, 1%, 0%, 69%)

Oklch

oklch(41.2% 0.018 201.8)

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

#A9B64D

Autumn Sage · GoldenRod · Sunflower

HEX

#A9B64D

RGB

rgb(169, 182, 77)

HSL

hsl(67, 42%, 51%)

HSB

hsb(67, 58%, 71%)

CMYK

cmyk(7%, 0%, 58%, 29%)

Oklch

oklch(74.5% 0.130 115.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#809DA0

Slate Blue · LightSlateGray · Lake Green

HEX

#809DA0

RGB

rgb(128, 157, 160)

HSL

hsl(186, 14%, 56%)

HSB

hsb(186, 20%, 63%)

CMYK

cmyk(20%, 2%, 0%, 37%)

Oklch

oklch(67.5% 0.033 204.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8D1816

168B8D

Analogous

8D1650

8D1816

8D5416

Triadic

8D1816

168D18

18168D

Split-Comp.

8D1816

168D54

16508D

Tetradic

8D1816

508D16

168B8D

54168D

Contrast Matrix WCAG 2.1 Contrast

8D1816	D24605	404E4F	A9B64D	809DA0
—	2.0 Fail	1.1 Fail	4.2 AA Large	3.2 AA Large
2.0 Fail	—	1.9 Fail	2.1 Fail	1.6 Fail
1.1 Fail	1.9 Fail	—	3.9 AA Large	3.0 Fail
4.2 AA Large	2.1 Fail	3.9 AA Large	—	1.3 Fail
3.2 AA Large	1.6 Fail	3.0 Fail	1.3 Fail	—

White BG

9.2AAA

4.5AA

8.7AAA

2.2Fail

2.9Fail

Black BG

2.3Fail

4.6AA

2.4Fail

9.5AAA

7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5916

959415

46464F

AFAF66

8D8D9F

Deuteranopia

616A17

9EA819

45444F

AEAD6D

8B899F

Tritanopia

871717

CB2124

414F4F

AA7A7F

819F9F

Achromatopsia

3B3B3B

686868

4A4A4A

A6A6A6

959595

Shades & Tints Shades & Tints

#8D1816

Dark

Light

#D24605

Dark

Light

#404E4F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8d1816;
  --color-2: #d24605;
  --color-3: #404e4f;
  --color-4: #a9b64d;
  --color-5: #809da0;
}

SCSS

$color-1: #8d1816;
$color-2: #d24605;
$color-3: #404e4f;
$color-4: #a9b64d;
$color-5: #809da0;

TAILWIND

colors: {
  'brand-1': '#8d1816',
  'brand-2': '#d24605',
  'brand-3': '#404e4f',
  'brand-4': '#a9b64d',
  'brand-5': '#809da0',
}

RGB Array

[141, 24, 22], [210, 70, 5], [64, 78, 79], [169, 182, 77], [128, 157, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8D1816, #D24605, #404E4F, #A9B64D, #809DA0 is ideal for: corporate websites, product showcases, portfolios. 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: #8d1816; --color-2: #d24605; --color-3: #404e4f; --color-4: #a9b64d; --color-5: #809da0. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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