← Back to Editor

#423F3F · #543837 · #852421 · #AD130E · #BF9704

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#423F3F

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#423F3F
RGB
rgb(66, 63, 63)
HSL
hsl(0, 2%, 25%)
HSB
hsb(0, 5%, 26%)
CMYK
cmyk(0%, 5%, 5%, 74%)
Oklch
oklch(37.1% 0.004 17.3)

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

#543837

Crimson · DarkSlateGray · Wine Red

HEX
#543837
RGB
rgb(84, 56, 55)
HSL
hsl(2, 21%, 27%)
HSB
hsb(2, 35%, 33%)
CMYK
cmyk(0%, 33%, 35%, 67%)
Oklch
oklch(37.3% 0.040 21.5)

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

#852421

Crimson · Brown · Wine Red

HEX
#852421
RGB
rgb(133, 36, 33)
HSL
hsl(2, 60%, 33%)
HSB
hsb(2, 75%, 52%)
CMYK
cmyk(0%, 73%, 75%, 48%)
Oklch
oklch(41.5% 0.132 26.5)

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

#AD130E

Vermilion · FireBrick · Wine Red

HEX
#AD130E
RGB
rgb(173, 19, 14)
HSL
hsl(2, 85%, 37%)
HSB
hsb(2, 92%, 68%)
CMYK
cmyk(0%, 89%, 92%, 32%)
Oklch
oklch(47.7% 0.186 28.9)

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

#BF9704

Ochre · DarkGoldenRod · Honey Gold

HEX
#BF9704
RGB
rgb(191, 151, 4)
HSL
hsl(47, 96%, 38%)
HSB
hsb(47, 98%, 75%)
CMYK
cmyk(0%, 21%, 98%, 25%)
Oklch
oklch(69.4% 0.141 89.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

423F3F
3E4141

Analogous

413E40
423F3F
41403E

Triadic

423F3F
3E413E
3E3E41

Split-Comp.

423F3F
3E4140
3E4041

Tetradic

423F3F
40413E
3E4141
403E41

Contrast Matrix WCAG 2.1 Contrast

423F3F
543837
852421
AD130E
BF9704
—
1.0
Fail
1.1
Fail
1.4
Fail
3.8
AA Large
1.0
Fail
—
1.1
Fail
1.4
Fail
3.8
AA Large
1.1
Fail
1.1
Fail
—
1.3
Fail
3.4
AA Large
1.4
Fail
1.4
Fail
1.3
Fail
—
2.7
Fail
3.8
AA Large
3.8
AA Large
3.4
AA Large
2.7
Fail
—
White BG
10.4AAA
10.5AAA
9.2AAA
7.3AAA
2.7Fail
Black BG
2.0Fail
2.0Fail
2.3Fail
2.9Fail
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

41413F
484837
5B5A22
6A690F
AEAD28

Deuteranopia

41413F
4A4C37
616822
737F10
B0B330

Tritanopia

423F3F
533737
802222
A51010
BD444A

Achromatopsia

404040
404040
414141
404040
929292

Shades & Tints Shades & Tints

#423F3F

Dark
Light

#543837

Dark
Light

#852421

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #423f3f;
  --color-2: #543837;
  --color-3: #852421;
  --color-4: #ad130e;
  --color-5: #bf9704;
}

SCSS

$color-1: #423f3f;
$color-2: #543837;
$color-3: #852421;
$color-4: #ad130e;
$color-5: #bf9704;

TAILWIND

colors: {
  'brand-1': '#423f3f',
  'brand-2': '#543837',
  'brand-3': '#852421',
  'brand-4': '#ad130e',
  'brand-5': '#bf9704',
}

RGB Array

[66, 63, 63], [84, 56, 55], [133, 36, 33], [173, 19, 14], [191, 151, 4]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #423F3F, #543837, #852421, #AD130E, #BF9704 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: #423f3f; --color-2: #543837; --color-3: #852421; --color-4: #ad130e; --color-5: #bf9704. 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