← Back to Editor

#332928 · #57352F · #FC320E · #FF4929 · #FC6044

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 AppData Visualization

Color Details Color Details

#332928

Crimson · DarkSlateGray · Deep Berry

HEX
#332928
RGB
rgb(51, 41, 40)
HSL
hsl(5, 12%, 18%)
HSB
hsb(5, 22%, 20%)
CMYK
cmyk(0%, 20%, 22%, 80%)
Oklch
oklch(29.2% 0.015 24.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#57352F

Crimson · DarkOliveGreen · Wine Red

HEX
#57352F
RGB
rgb(87, 53, 47)
HSL
hsl(9, 30%, 26%)
HSB
hsb(9, 46%, 34%)
CMYK
cmyk(0%, 39%, 46%, 66%)
Oklch
oklch(36.8% 0.051 30.6)

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

#FC320E

Vermilion · OrangeRed · Passion Red

HEX
#FC320E
RGB
rgb(252, 50, 14)
HSL
hsl(9, 98%, 52%)
HSB
hsb(9, 94%, 99%)
CMYK
cmyk(0%, 80%, 94%, 1%)
Oklch
oklch(64.1% 0.238 31.8)

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

#FF4929

Vermilion · Tomato · Passion Red

HEX
#FF4929
RGB
rgb(255, 73, 41)
HSL
hsl(9, 100%, 58%)
HSB
hsb(9, 84%, 100%)
CMYK
cmyk(0%, 71%, 84%, 0%)
Oklch
oklch(66.5% 0.223 32.3)

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

#FC6044

Peach Pink · Tomato · Coral Red

HEX
#FC6044
RGB
rgb(252, 96, 68)
HSL
hsl(9, 97%, 63%)
HSB
hsb(9, 73%, 99%)
CMYK
cmyk(0%, 62%, 73%, 1%)
Oklch
oklch(68.8% 0.196 32.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332928
283233

Analogous

33282D
332928
332F28

Triadic

332928
283329
292833

Split-Comp.

332928
28332F
282D33

Tetradic

332928
2D3328
283233
2F2833

Contrast Matrix WCAG 2.1 Contrast

332928
57352F
FC320E
FF4929
FC6044
—
1.3
Fail
3.8
AA Large
4.2
AA Large
4.6
AA
1.3
Fail
—
2.9
Fail
3.2
AA Large
3.5
AA Large
3.8
AA Large
2.9
Fail
—
1.1
Fail
1.2
Fail
4.2
AA Large
3.2
AA Large
1.1
Fail
—
1.1
Fail
4.6
AA
3.5
AA Large
1.2
Fail
1.1
Fail
—
White BG
14.1AAA
10.7AAA
3.7AA Large
3.4AA Large
3.0AA Large
Black BG
1.5Fail
2.0Fail
5.6AA
6.2AA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2F2F28
484830
A5A317
B0AF31
B8B74B

Deuteranopia

2F3028
4A4D31
B0BF19
BBC833
C2CD4C

Tritanopia

322828
553232
F21E1F
F63738
F45051

Achromatopsia

2C2C2C
3E3E3E
6A6A6A
7C7C7C
8B8B8B

Shades & Tints Shades & Tints

#332928

Dark
Light

#57352F

Dark
Light

#FC320E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332928;
  --color-2: #57352f;
  --color-3: #fc320e;
  --color-4: #ff4929;
  --color-5: #fc6044;
}

SCSS

$color-1: #332928;
$color-2: #57352f;
$color-3: #fc320e;
$color-4: #ff4929;
$color-5: #fc6044;

TAILWIND

colors: {
  'brand-1': '#332928',
  'brand-2': '#57352f',
  'brand-3': '#fc320e',
  'brand-4': '#ff4929',
  'brand-5': '#fc6044',
}

RGB Array

[51, 41, 40], [87, 53, 47], [252, 50, 14], [255, 73, 41], [252, 96, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #332928, #57352F, #FC320E, #FF4929, #FC6044 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #332928; --color-2: #57352f; --color-3: #fc320e; --color-4: #ff4929; --color-5: #fc6044. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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