← Back to Editor

#4362DE · #1B36A1 · #0D194A · #F24916 · #A1031B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#4362DE

Azure · SlateBlue · Navy Blue

HEX
#4362DE
RGB
rgb(67, 98, 222)
HSL
hsl(228, 70%, 57%)
HSB
hsb(228, 70%, 87%)
CMYK
cmyk(70%, 56%, 0%, 13%)
Oklch
oklch(54.5% 0.192 268.6)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#1B36A1

Indigo · DarkSlateBlue · Prussian Blue

HEX
#1B36A1
RGB
rgb(27, 54, 161)
HSL
hsl(228, 71%, 37%)
HSB
hsb(228, 83%, 63%)
CMYK
cmyk(83%, 66%, 0%, 37%)
Oklch
oklch(39.1% 0.175 266.5)

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

#0D194A

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0D194A
RGB
rgb(13, 25, 74)
HSL
hsl(228, 70%, 17%)
HSB
hsb(228, 82%, 29%)
CMYK
cmyk(82%, 66%, 0%, 71%)
Oklch
oklch(23.9% 0.092 268.0)

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

#F24916

Vermilion · OrangeRed · Passion Red

HEX
#F24916
RGB
rgb(242, 73, 22)
HSL
hsl(14, 89%, 52%)
HSB
hsb(14, 91%, 95%)
CMYK
cmyk(0%, 70%, 91%, 5%)
Oklch
oklch(64.3% 0.213 35.5)

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

#A1031B

Vermilion · DarkRed · Wine Red

HEX
#A1031B
RGB
rgb(161, 3, 27)
HSL
hsl(351, 96%, 32%)
HSB
hsb(351, 98%, 63%)
CMYK
cmyk(0%, 98%, 83%, 37%)
Oklch
oklch(44.8% 0.180 24.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4362DE
DEBF45

Analogous

45B0DE
4362DE
7345DE

Triadic

4362DE
DE4563
63DE45

Split-Comp.

4362DE
DE7345
B0DE45

Tetradic

4362DE
DE45B0
DEBF45
45DE73

Contrast Matrix WCAG 2.1 Contrast

4362DE
1B36A1
0D194A
F24916
A1031B
—
1.9
Fail
3.2
AA Large
1.4
Fail
1.6
Fail
1.9
Fail
—
1.7
Fail
2.7
Fail
1.2
Fail
3.2
AA Large
1.7
Fail
—
4.6
AA
2.0
Fail
1.4
Fail
2.7
Fail
4.6
AA
—
2.3
Fail
1.6
Fail
1.2
Fail
2.0
Fail
2.3
Fail
—
White BG
5.2AA
10.1AAA
16.7AAA
3.7AA Large
8.3AAA
Black BG
4.0AA Large
2.1Fail
1.3Fail
5.7AA
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5051C0
272787
12123E
A9A722
5D5B15

Deuteranopia

4F4CB9
252381
12113B
B3BF25
667214

Tritanopia

45A8A3
1C736E
0E3533
EA2C2E
991110

Achromatopsia

676767
3A3A3A
1B1B1B
767676
353535

Shades & Tints Shades & Tints

#4362DE

Dark
Light

#1B36A1

Dark
Light

#0D194A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4362de;
  --color-2: #1b36a1;
  --color-3: #0d194a;
  --color-4: #f24916;
  --color-5: #a1031b;
}

SCSS

$color-1: #4362de;
$color-2: #1b36a1;
$color-3: #0d194a;
$color-4: #f24916;
$color-5: #a1031b;

TAILWIND

colors: {
  'brand-1': '#4362de',
  'brand-2': '#1b36a1',
  'brand-3': '#0d194a',
  'brand-4': '#f24916',
  'brand-5': '#a1031b',
}

RGB Array

[67, 98, 222], [27, 54, 161], [13, 25, 74], [242, 73, 22], [161, 3, 27]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4362DE, #1B36A1, #0D194A, #F24916, #A1031B 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: #4362de; --color-2: #1b36a1; --color-3: #0d194a; --color-4: #f24916; --color-5: #a1031b. 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