← Back to Editor

#1C1822 · #453435 · #703A36 · #8C4634 · #A83F21

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1C1822

Deep Indigo · Black · Dark Purple

HEX
#1C1822
RGB
rgb(28, 24, 34)
HSL
hsl(264, 17%, 11%)
HSB
hsb(264, 29%, 13%)
CMYK
cmyk(18%, 29%, 0%, 87%)
Oklch
oklch(21.8% 0.020 303.0)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#453435

Crimson · DarkSlateGray · Wine Red

HEX
#453435
RGB
rgb(69, 52, 53)
HSL
hsl(356, 14%, 24%)
HSB
hsb(356, 25%, 27%)
CMYK
cmyk(0%, 25%, 23%, 73%)
Oklch
oklch(34.4% 0.025 14.5)

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

#703A36

Crimson · Sienna · Wine Red

HEX
#703A36
RGB
rgb(112, 58, 54)
HSL
hsl(4, 35%, 33%)
HSB
hsb(4, 52%, 44%)
CMYK
cmyk(0%, 48%, 52%, 56%)
Oklch
oklch(41.6% 0.077 25.3)

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

#8C4634

Crimson · Sienna · Wine Red

HEX
#8C4634
RGB
rgb(140, 70, 52)
HSL
hsl(12, 46%, 38%)
HSB
hsb(12, 63%, 55%)
CMYK
cmyk(0%, 50%, 63%, 45%)
Oklch
oklch(47.8% 0.100 35.5)

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

#A83F21

Vermilion · Brown · Wine Red

HEX
#A83F21
RGB
rgb(168, 63, 33)
HSL
hsl(13, 67%, 39%)
HSB
hsb(13, 80%, 66%)
CMYK
cmyk(0%, 63%, 80%, 34%)
Oklch
oklch(50.9% 0.145 36.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1C1822
1D2117

Analogous

171821
1C1822
201721

Triadic

1C1822
211B17
17211B

Split-Comp.

1C1822
212017
182117

Tetradic

1C1822
211718
1D2117
172120

Contrast Matrix WCAG 2.1 Contrast

1C1822
453435
703A36
8C4634
A83F21
—
1.5
Fail
2.0
Fail
2.5
Fail
2.8
Fail
1.5
Fail
—
1.3
Fail
1.7
Fail
1.9
Fail
2.0
Fail
1.3
Fail
—
1.3
Fail
1.4
Fail
2.5
Fail
1.7
Fail
1.3
Fail
—
1.1
Fail
2.8
Fail
1.9
Fail
1.4
Fail
1.1
Fail
—
White BG
17.5AAA
11.7AAA
8.9AAA
6.9AA
6.2AA
Black BG
1.2Fail
1.8Fail
2.3Fail
3.0AA Large
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

1A1A20
3E3D35
595837
6E6D38
7B7A28

Deuteranopia

1B1B1F
3F4035
5C6037
727739
81892A

Tritanopia

1C1E1D
443535
6D3838
893C3D
A32E2F

Achromatopsia

1A1A1A
393939
4A4A4A
595959
5B5B5B

Shades & Tints Shades & Tints

#1C1822

Dark
Light

#453435

Dark
Light

#703A36

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1c1822;
  --color-2: #453435;
  --color-3: #703a36;
  --color-4: #8c4634;
  --color-5: #a83f21;
}

SCSS

$color-1: #1c1822;
$color-2: #453435;
$color-3: #703a36;
$color-4: #8c4634;
$color-5: #a83f21;

TAILWIND

colors: {
  'brand-1': '#1c1822',
  'brand-2': '#453435',
  'brand-3': '#703a36',
  'brand-4': '#8c4634',
  'brand-5': '#a83f21',
}

RGB Array

[28, 24, 34], [69, 52, 53], [112, 58, 54], [140, 70, 52], [168, 63, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1C1822, #453435, #703A36, #8C4634, #A83F21 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: #1c1822; --color-2: #453435; --color-3: #703a36; --color-4: #8c4634; --color-5: #a83f21. 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