← Back to Editor

#421F3F · #4C1E40 · #820639 · #EE3240 · #FF9808

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

#421F3F

Rose Purple · DarkSlateGray · Dark Purple

HEX
#421F3F
RGB
rgb(66, 31, 63)
HSL
hsl(305, 36%, 19%)
HSB
hsb(305, 53%, 26%)
CMYK
cmyk(0%, 53%, 5%, 74%)
Oklch
oklch(30.1% 0.072 330.4)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#4C1E40

Rose Purple · DarkSlateGray · Eggplant

HEX
#4C1E40
RGB
rgb(76, 30, 64)
HSL
hsl(316, 43%, 21%)
HSB
hsb(316, 61%, 30%)
CMYK
cmyk(0%, 61%, 16%, 70%)
Oklch
oklch(31.6% 0.084 338.6)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#820639

Dark Violet · Brown · Camellia

HEX
#820639
RGB
rgb(130, 6, 57)
HSL
hsl(335, 91%, 27%)
HSB
hsb(335, 95%, 51%)
CMYK
cmyk(0%, 95%, 56%, 49%)
Oklch
oklch(39.3% 0.153 6.0)

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

#EE3240

Vermilion · Crimson · Passion Red

HEX
#EE3240
RGB
rgb(238, 50, 64)
HSL
hsl(356, 85%, 56%)
HSB
hsb(356, 79%, 93%)
CMYK
cmyk(0%, 79%, 73%, 7%)
Oklch
oklch(62.0% 0.221 23.3)

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

#FF9808

Ginger · Orange · Warm Sun

HEX
#FF9808
RGB
rgb(255, 152, 8)
HSL
hsl(35, 100%, 52%)
HSB
hsb(35, 97%, 100%)
CMYK
cmyk(0%, 40%, 97%, 0%)
Oklch
oklch(77.0% 0.173 63.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

421F3F
1F4222

Analogous

331F42
421F3F
421F2E

Triadic

421F3F
3F421F
1F3F42

Split-Comp.

421F3F
2E421F
1F4233

Tetradic

421F3F
42331F
1F4222
1F2E42

Contrast Matrix WCAG 2.1 Contrast

421F3F
4C1E40
820639
EE3240
FF9808
—
1.0
Fail
1.4
Fail
3.4
AA Large
6.5
AA
1.0
Fail
—
1.3
Fail
3.3
AA Large
6.2
AA
1.4
Fail
1.3
Fail
—
2.5
Fail
4.8
AA
3.4
AA Large
3.3
AA Large
2.5
Fail
—
1.9
Fail
6.5
AA
6.2
AA
4.8
AA
1.9
Fail
—
White BG
14.0AAA
13.4AAA
10.3AAA
4.1AA Large
2.2Fail
Black BG
1.5Fail
1.6Fail
2.0Fail
5.2AA
9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333337
383838
4C4B2D
9D9B3D
D2D12B

Deuteranopia

353735
3B3E36
545D2A
A8B63C
D8E033

Tritanopia

403130
4A3130
7C2321
E53A39
FA464C

Achromatopsia

2D2D2D
303030
313131
6C6C6C
A6A6A6

Shades & Tints Shades & Tints

#421F3F

Dark
Light

#4C1E40

Dark
Light

#820639

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #421f3f;
  --color-2: #4c1e40;
  --color-3: #820639;
  --color-4: #ee3240;
  --color-5: #ff9808;
}

SCSS

$color-1: #421f3f;
$color-2: #4c1e40;
$color-3: #820639;
$color-4: #ee3240;
$color-5: #ff9808;

TAILWIND

colors: {
  'brand-1': '#421f3f',
  'brand-2': '#4c1e40',
  'brand-3': '#820639',
  'brand-4': '#ee3240',
  'brand-5': '#ff9808',
}

RGB Array

[66, 31, 63], [76, 30, 64], [130, 6, 57], [238, 50, 64], [255, 152, 8]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #421F3F, #4C1E40, #820639, #EE3240, #FF9808 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: #421f3f; --color-2: #4c1e40; --color-3: #820639; --color-4: #ee3240; --color-5: #ff9808. 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