← Back to Editor

#332E24 · #C48000 · #BF3D26 · #C40045 · #880A37

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#332E24

Ochre · DarkSlateGray · Amber Gold

HEX
#332E24
RGB
rgb(51, 46, 36)
HSL
hsl(40, 17%, 17%)
HSB
hsb(40, 29%, 20%)
CMYK
cmyk(0%, 10%, 29%, 80%)
Oklch
oklch(30.3% 0.019 84.5)

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

#C48000

Ochre · DarkGoldenRod · Amber Brown

HEX
#C48000
RGB
rgb(196, 128, 0)
HSL
hsl(39, 100%, 38%)
HSB
hsb(39, 100%, 77%)
CMYK
cmyk(0%, 35%, 100%, 23%)
Oklch
oklch(65.4% 0.140 72.2)

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

#BF3D26

Vermilion · FireBrick · Passion Red

HEX
#BF3D26
RGB
rgb(191, 61, 38)
HSL
hsl(9, 67%, 45%)
HSB
hsb(9, 80%, 75%)
CMYK
cmyk(0%, 68%, 80%, 25%)
Oklch
oklch(54.5% 0.170 32.4)

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

#C40045

Dark Violet · Crimson · Camellia

HEX
#C40045
RGB
rgb(196, 0, 69)
HSL
hsl(339, 100%, 38%)
HSB
hsb(339, 100%, 77%)
CMYK
cmyk(0%, 100%, 65%, 23%)
Oklch
oklch(52.2% 0.209 13.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#880A37

Dark Violet · Brown · Camellia

HEX
#880A37
RGB
rgb(136, 10, 55)
HSL
hsl(339, 86%, 29%)
HSB
hsb(339, 93%, 53%)
CMYK
cmyk(0%, 93%, 60%, 47%)
Oklch
oklch(40.6% 0.156 9.1)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332E24
242933

Analogous

332624
332E24
303324

Triadic

332E24
24332E
2E2433

Split-Comp.

332E24
243033
262433

Tetradic

332E24
243326
242933
332430

Contrast Matrix WCAG 2.1 Contrast

332E24
C48000
BF3D26
C40045
880A37
—
4.1
AA Large
2.5
Fail
2.2
Fail
1.4
Fail
4.1
AA Large
—
1.6
Fail
1.9
Fail
3.0
Fail
2.5
Fail
1.6
Fail
—
1.1
Fail
1.8
Fail
2.2
Fail
1.9
Fail
1.1
Fail
—
1.6
Fail
1.4
Fail
3.0
Fail
1.8
Fail
1.6
Fail
—
White BG
13.5AAA
3.3AA Large
5.4AA
6.1AA
9.8AAA
Black BG
1.6Fail
6.4AA
3.9AA Large
3.4AA Large
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

313126
A7A61F
87862C
6F6D34
51502C

Deuteranopia

313127
ABB026
8E982D
7B8930
59622A

Tritanopia

332829
C1373D
B93031
BA2724
822422

Achromatopsia

2E2E2E
868686
616161
424242
353535

Shades & Tints Shades & Tints

#332E24

Dark
Light

#C48000

Dark
Light

#BF3D26

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332e24;
  --color-2: #c48000;
  --color-3: #bf3d26;
  --color-4: #c40045;
  --color-5: #880a37;
}

SCSS

$color-1: #332e24;
$color-2: #c48000;
$color-3: #bf3d26;
$color-4: #c40045;
$color-5: #880a37;

TAILWIND

colors: {
  'brand-1': '#332e24',
  'brand-2': '#c48000',
  'brand-3': '#bf3d26',
  'brand-4': '#c40045',
  'brand-5': '#880a37',
}

RGB Array

[51, 46, 36], [196, 128, 0], [191, 61, 38], [196, 0, 69], [136, 10, 55]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #332E24, #C48000, #BF3D26, #C40045, #880A37 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #332e24; --color-2: #c48000; --color-3: #bf3d26; --color-4: #c40045; --color-5: #880a37. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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