#8D2104 + #975823 + #B35E1B + #87A29B + #4E3E31 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8D2104

Vermilion · DarkRed · Wine Red

HEX

#8D2104

RGB

rgb(141, 33, 4)

HSL

hsl(13, 94%, 28%)

HSB

hsb(13, 97%, 55%)

CMYK

cmyk(0%, 77%, 97%, 45%)

Oklch

oklch(42.4% 0.148 34.3)

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

#975823

Tangerine · Sienna · Amber Brown

HEX

#975823

RGB

rgb(151, 88, 35)

HSL

hsl(27, 62%, 36%)

HSB

hsb(27, 77%, 59%)

CMYK

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

Oklch

oklch(52.3% 0.106 57.1)

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

#B35E1B

Tangerine · Sienna · Amber Brown

HEX

#B35E1B

RGB

rgb(179, 94, 27)

HSL

hsl(26, 74%, 40%)

HSB

hsb(26, 85%, 70%)

CMYK

cmyk(0%, 47%, 85%, 30%)

Oklch

oklch(57.2% 0.133 53.1)

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

#87A29B

Mineral Blue · DarkSeaGreen · Lake Green

HEX

#87A29B

RGB

rgb(135, 162, 155)

HSL

hsl(164, 13%, 58%)

HSB

hsb(164, 17%, 64%)

CMYK

cmyk(17%, 0%, 4%, 36%)

Oklch

oklch(68.9% 0.032 177.9)

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

#4E3E31

Tangerine · DarkOliveGreen · Cinnamon

HEX

#4E3E31

RGB

rgb(78, 62, 49)

HSL

hsl(27, 23%, 25%)

HSB

hsb(27, 37%, 31%)

CMYK

cmyk(0%, 21%, 37%, 69%)

Oklch

oklch(37.7% 0.031 60.8)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8D2104

046D8B

Analogous

8B042A

8D2104

8B6404

Triadic

8D2104

048B21

21048B

Split-Comp.

8D2104

048B64

042A8B

Tetradic

8D2104

2A8B04

046D8B

64048B

Contrast Matrix WCAG 2.1 Contrast

8D2104	975823	B35E1B	87A29B	4E3E31
—	1.6 Fail	1.9 Fail	3.3 AA Large	1.1 Fail
1.6 Fail	—	1.2 Fail	2.1 Fail	1.8 Fail
1.9 Fail	1.2 Fail	—	1.7 Fail	2.2 Fail
3.3 AA Large	2.1 Fail	1.7 Fail	—	3.7 AA Large
1.1 Fail	1.8 Fail	2.2 Fail	3.7 AA Large	—

White BG

8.9AAA

5.6AA

4.6AA

2.7Fail

10.2AAA

Black BG

2.4Fail

3.7AA Large

4.5AA

7.7AAA

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5D0B

7C7B30

8E8D2B

93939D

474734

Deuteranopia

656D0D

7F8433

939A2F

918F9D

484935

Tritanopia

881112

943A3C

AF383B

889E9E

4D3737

Achromatopsia

3E3E3E

656565

707070

999999

414141

Shades & Tints Shades & Tints

#8D2104

Dark

Light

#975823

Dark

Light

#B35E1B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8d2104;
  --color-2: #975823;
  --color-3: #b35e1b;
  --color-4: #87a29b;
  --color-5: #4e3e31;
}

SCSS

$color-1: #8d2104;
$color-2: #975823;
$color-3: #b35e1b;
$color-4: #87a29b;
$color-5: #4e3e31;

TAILWIND

colors: {
  'brand-1': '#8d2104',
  'brand-2': '#975823',
  'brand-3': '#b35e1b',
  'brand-4': '#87a29b',
  'brand-5': '#4e3e31',
}

RGB Array

[141, 33, 4], [151, 88, 35], [179, 94, 27], [135, 162, 155], [78, 62, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8D2104, #975823, #B35E1B, #87A29B, #4E3E31 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: #8d2104; --color-2: #975823; --color-3: #b35e1b; --color-4: #87a29b; --color-5: #4e3e31. 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