← Back to Editor

#32323E · #4A3D2D · #764908 · #30231D · #A73C28

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

#32323E

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#32323E
RGB
rgb(50, 50, 62)
HSL
hsl(240, 11%, 22%)
HSB
hsb(240, 19%, 24%)
CMYK
cmyk(19%, 19%, 0%, 76%)
Oklch
oklch(32.2% 0.021 285.1)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#4A3D2D

Ochre · DarkSlateGray · Cinnamon

HEX
#4A3D2D
RGB
rgb(74, 61, 45)
HSL
hsl(33, 24%, 23%)
HSB
hsb(33, 39%, 29%)
CMYK
cmyk(0%, 18%, 39%, 71%)
Oklch
oklch(36.9% 0.032 72.4)

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

#764908

Ochre · Olive · Cinnamon

HEX
#764908
RGB
rgb(118, 73, 8)
HSL
hsl(35, 87%, 25%)
HSB
hsb(35, 93%, 46%)
CMYK
cmyk(0%, 38%, 93%, 54%)
Oklch
oklch(44.7% 0.094 68.3)

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

#30231D

Tangerine · Black · Cinnamon

HEX
#30231D
RGB
rgb(48, 35, 29)
HSL
hsl(19, 25%, 15%)
HSB
hsb(19, 40%, 19%)
CMYK
cmyk(0%, 27%, 40%, 81%)
Oklch
oklch(27.0% 0.023 46.0)

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

#A73C28

Vermilion · Brown · Passion Red

HEX
#A73C28
RGB
rgb(167, 60, 40)
HSL
hsl(9, 61%, 41%)
HSB
hsb(9, 76%, 65%)
CMYK
cmyk(0%, 64%, 76%, 35%)
Oklch
oklch(50.4% 0.145 32.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

32323E
3E3E32

Analogous

32383E
32323E
38323E

Triadic

32323E
3E3232
323E32

Split-Comp.

32323E
3E3832
383E32

Tetradic

32323E
3E3238
3E3E32
323E38

Contrast Matrix WCAG 2.1 Contrast

32323E
4A3D2D
764908
30231D
A73C28
—
1.2
Fail
1.6
Fail
1.2
Fail
2.0
Fail
1.2
Fail
—
1.4
Fail
1.4
Fail
1.7
Fail
1.6
Fail
1.4
Fail
—
2.0
Fail
1.2
Fail
1.2
Fail
1.4
Fail
2.0
Fail
—
2.4
Fail
2.0
Fail
1.7
Fail
1.2
Fail
2.4
Fail
—
White BG
12.6AAA
10.5AAA
7.7AAA
15.2AAA
6.3AA
Black BG
1.7Fail
2.0Fail
2.7Fail
1.4Fail
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

32323B
444431
636218
2A2A1E
79782D

Deuteranopia

32323A
454632
65691C
2B2C1F
7F872E

Tritanopia

323938
493435
742427
2F2020
A23132

Achromatopsia

333333
3F3F3F
4F4F4F
262626
5A5A5A

Shades & Tints Shades & Tints

#32323E

Dark
Light

#4A3D2D

Dark
Light

#764908

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #32323e;
  --color-2: #4a3d2d;
  --color-3: #764908;
  --color-4: #30231d;
  --color-5: #a73c28;
}

SCSS

$color-1: #32323e;
$color-2: #4a3d2d;
$color-3: #764908;
$color-4: #30231d;
$color-5: #a73c28;

TAILWIND

colors: {
  'brand-1': '#32323e',
  'brand-2': '#4a3d2d',
  'brand-3': '#764908',
  'brand-4': '#30231d',
  'brand-5': '#a73c28',
}

RGB Array

[50, 50, 62], [74, 61, 45], [118, 73, 8], [48, 35, 29], [167, 60, 40]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #32323E, #4A3D2D, #764908, #30231D, #A73C28 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: #32323e; --color-2: #4a3d2d; --color-3: #764908; --color-4: #30231d; --color-5: #a73c28. 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