← Back to Editor

#473A54 · #912346 · #C51929 · #D30F19 · #E30409

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

#473A54

Dark Plum · DarkSlateGray · Eggplant

HEX
#473A54
RGB
rgb(71, 58, 84)
HSL
hsl(270, 18%, 28%)
HSB
hsb(270, 31%, 33%)
CMYK
cmyk(15%, 31%, 0%, 67%)
Oklch
oklch(37.3% 0.047 307.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#912346

Dark Violet · Brown · Camellia

HEX
#912346
RGB
rgb(145, 35, 70)
HSL
hsl(341, 61%, 35%)
HSB
hsb(341, 76%, 57%)
CMYK
cmyk(0%, 76%, 52%, 43%)
Oklch
oklch(44.4% 0.147 6.6)

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

#C51929

Vermilion · FireBrick · Passion Red

HEX
#C51929
RGB
rgb(197, 25, 41)
HSL
hsl(354, 77%, 44%)
HSB
hsb(354, 87%, 77%)
CMYK
cmyk(0%, 87%, 79%, 23%)
Oklch
oklch(52.8% 0.201 24.3)

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

#D30F19

Vermilion · Crimson · Passion Red

HEX
#D30F19
RGB
rgb(211, 15, 25)
HSL
hsl(357, 87%, 44%)
HSB
hsb(357, 93%, 83%)
CMYK
cmyk(0%, 93%, 88%, 17%)
Oklch
oklch(54.9% 0.218 27.3)

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

#E30409

Vermilion · Red · Passion Red

HEX
#E30409
RGB
rgb(227, 4, 9)
HSL
hsl(359, 97%, 45%)
HSB
hsb(359, 98%, 89%)
CMYK
cmyk(0%, 98%, 96%, 11%)
Oklch
oklch(57.6% 0.235 28.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

473A54
47543B

Analogous

3B3B54
473A54
543B54

Triadic

473A54
54473B
3B5447

Split-Comp.

473A54
54543B
3B543B

Tetradic

473A54
543B3B
47543B
3B5454

Contrast Matrix WCAG 2.1 Contrast

473A54
912346
C51929
D30F19
E30409
—
1.3
Fail
1.8
Fail
1.9
Fail
2.1
Fail
1.3
Fail
—
1.4
Fail
1.5
Fail
1.7
Fail
1.8
Fail
1.4
Fail
—
1.1
Fail
1.2
Fail
1.9
Fail
1.5
Fail
1.1
Fail
—
1.1
Fail
2.1
Fail
1.7
Fail
1.2
Fail
1.1
Fail
—
White BG
10.5AAA
8.3AAA
5.9AA
5.5AA
4.9AA
Black BG
2.0Fail
2.5Fail
3.5AA Large
3.9AA Large
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

41414E
61603E
7B7925
7E7C17
828008

Deuteranopia

42434C
68703C
859124
8A9816
8FA008

Tritanopia

464948
8C3735
BC2221
C91514
D80707

Achromatopsia

414141
484848
4E4E4E
4B4B4B
474747

Shades & Tints Shades & Tints

#473A54

Dark
Light

#912346

Dark
Light

#C51929

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #473a54;
  --color-2: #912346;
  --color-3: #c51929;
  --color-4: #d30f19;
  --color-5: #e30409;
}

SCSS

$color-1: #473a54;
$color-2: #912346;
$color-3: #c51929;
$color-4: #d30f19;
$color-5: #e30409;

TAILWIND

colors: {
  'brand-1': '#473a54',
  'brand-2': '#912346',
  'brand-3': '#c51929',
  'brand-4': '#d30f19',
  'brand-5': '#e30409',
}

RGB Array

[71, 58, 84], [145, 35, 70], [197, 25, 41], [211, 15, 25], [227, 4, 9]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #473A54, #912346, #C51929, #D30F19, #E30409 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: #473a54; --color-2: #912346; --color-3: #c51929; --color-4: #d30f19; --color-5: #e30409. 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