← Back to Editor

#2C0355 · #362B87 · #405DB9 · #4A8FCD · #90CBF0

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#2C0355

Royal Purple · MidnightBlue · Dark Purple

HEX
#2C0355
RGB
rgb(44, 3, 85)
HSL
hsl(270, 93%, 17%)
HSB
hsb(270, 96%, 33%)
CMYK
cmyk(48%, 96%, 0%, 67%)
Oklch
oklch(25.0% 0.129 298.4)

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

#362B87

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#362B87
RGB
rgb(54, 43, 135)
HSL
hsl(247, 52%, 35%)
HSB
hsb(247, 68%, 53%)
CMYK
cmyk(60%, 68%, 0%, 47%)
Oklch
oklch(36.3% 0.147 281.6)

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

#405DB9

Indigo · SteelBlue · Navy Blue

HEX
#405DB9
RGB
rgb(64, 93, 185)
HSL
hsl(226, 49%, 49%)
HSB
hsb(226, 65%, 73%)
CMYK
cmyk(65%, 50%, 0%, 27%)
Oklch
oklch(50.6% 0.149 267.7)

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

#4A8FCD

Lake Blue · SteelBlue · Navy Blue

HEX
#4A8FCD
RGB
rgb(74, 143, 205)
HSL
hsl(208, 57%, 55%)
HSB
hsb(208, 64%, 80%)
CMYK
cmyk(64%, 30%, 0%, 20%)
Oklch
oklch(63.2% 0.117 247.9)

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

#90CBF0

Sky Blue · SkyBlue · Cobalt Blue

HEX
#90CBF0
RGB
rgb(144, 203, 240)
HSL
hsl(203, 76%, 75%)
HSB
hsb(203, 40%, 94%)
CMYK
cmyk(40%, 15%, 0%, 6%)
Oklch
oklch(81.5% 0.080 236.6)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2C0355
2B5403

Analogous

030354
2C0355
540354

Triadic

2C0355
542B03
03542B

Split-Comp.

2C0355
545403
035403

Tetradic

2C0355
540303
2B5403
035454

Contrast Matrix WCAG 2.1 Contrast

2C0355
362B87
405DB9
4A8FCD
90CBF0
—
1.5
Fail
2.8
Fail
4.9
AA
9.6
AAA
1.5
Fail
—
1.9
Fail
3.3
AA Large
6.5
AA
2.8
Fail
1.9
Fail
—
1.8
Fail
3.4
AA Large
4.9
AA
3.3
AA Large
1.8
Fail
—
2.0
Fail
9.6
AAA
6.5
AA
3.4
AA Large
2.0
Fail
—
White BG
16.8AAA
11.3AAA
6.0AA
3.4AA Large
1.8Fail
Black BG
1.3Fail
1.9Fail
3.5AA Large
6.1AA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1A1A41
313171
4D4DA3
6868BE
AAAAE7

Deuteranopia

1D203C
32336B
4B499D
645FBA
A6A2E5

Tritanopia

2A312E
355F5B
41918D
4DB2B0
93E0DE

Achromatopsia

191919
393939
5F5F5F
818181
BEBEBE

Shades & Tints Shades & Tints

#2C0355

Dark
Light

#362B87

Dark
Light

#405DB9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2c0355;
  --color-2: #362b87;
  --color-3: #405db9;
  --color-4: #4a8fcd;
  --color-5: #90cbf0;
}

SCSS

$color-1: #2c0355;
$color-2: #362b87;
$color-3: #405db9;
$color-4: #4a8fcd;
$color-5: #90cbf0;

TAILWIND

colors: {
  'brand-1': '#2c0355',
  'brand-2': '#362b87',
  'brand-3': '#405db9',
  'brand-4': '#4a8fcd',
  'brand-5': '#90cbf0',
}

RGB Array

[44, 3, 85], [54, 43, 135], [64, 93, 185], [74, 143, 205], [144, 203, 240]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2C0355, #362B87, #405DB9, #4A8FCD, #90CBF0 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: #2c0355; --color-2: #362b87; --color-3: #405db9; --color-4: #4a8fcd; --color-5: #90cbf0. 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