#5A01C6 + #39227D + #565E72 + #323A4B + #03AEFE · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5A01C6

Deep Indigo · DarkViolet · Eggplant

HEX

#5A01C6

RGB

rgb(90, 1, 198)

HSL

hsl(267, 99%, 39%)

HSB

hsb(267, 99%, 78%)

CMYK

cmyk(55%, 99%, 0%, 22%)

Oklch

oklch(43.0% 0.242 290.6)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#39227D

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#39227D

RGB

rgb(57, 34, 125)

HSL

hsl(255, 57%, 31%)

HSB

hsb(255, 73%, 49%)

CMYK

cmyk(54%, 73%, 0%, 51%)

Oklch

oklch(34.2% 0.144 287.8)

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

#565E72

Indigo · DimGray · Prussian Blue

HEX

#565E72

RGB

rgb(86, 94, 114)

HSL

hsl(223, 14%, 39%)

HSB

hsb(223, 25%, 45%)

CMYK

cmyk(25%, 18%, 0%, 55%)

Oklch

oklch(48.3% 0.034 268.0)

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

#323A4B

Indigo · DarkSlateGray · Prussian Blue

HEX

#323A4B

RGB

rgb(50, 58, 75)

HSL

hsl(221, 20%, 25%)

HSB

hsb(221, 33%, 29%)

CMYK

cmyk(33%, 23%, 0%, 71%)

Oklch

oklch(34.8% 0.032 265.1)

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

#03AEFE

Lake Blue · DeepSkyBlue · Mint Ice

HEX

#03AEFE

RGB

rgb(3, 174, 254)

HSL

hsl(199, 99%, 50%)

HSB

hsb(199, 99%, 100%)

CMYK

cmyk(99%, 31%, 0%, 0%)

Oklch

oklch(71.6% 0.163 240.0)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5A01C6

6DC601

Analogous

010BC6

5A01C6

BC01C6

Triadic

5A01C6

C65A01

01C65A

Split-Comp.

5A01C6

C6BC01

0BC601

Tetradic

5A01C6

C6010B

6DC601

01C6BC

Contrast Matrix WCAG 2.1 Contrast

5A01C6	39227D	565E72	323A4B	03AEFE
—	1.3 Fail	1.4 Fail	1.2 Fail	3.8 AA Large
1.3 Fail	—	1.9 Fail	1.1 Fail	5.0 AA
1.4 Fail	1.9 Fail	—	1.8 Fail	2.6 Fail
1.2 Fail	1.1 Fail	1.8 Fail	—	4.6 AA
3.8 AA Large	5.0 AA	2.6 Fail	4.6 AA	—

White BG

9.3AAA

12.4AAA

6.5AA

11.4AAA

2.5Fail

Black BG

2.3Fail

1.7Fail

3.2AA Large

1.8Fail

8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333396

2F2F67

595A6D

353647

4D4FEB

Deuteranopia

393F8B

303262

59586C

353446

4336E6

Tritanopia

567168

385652

566969

324443

0CDBD8

Achromatopsia

323232

333333

5E5E5E

3A3A3A

848484

Shades & Tints Shades & Tints

#5A01C6

Dark

Light

#39227D

Dark

Light

#565E72

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5a01c6;
  --color-2: #39227d;
  --color-3: #565e72;
  --color-4: #323a4b;
  --color-5: #03aefe;
}

SCSS

$color-1: #5a01c6;
$color-2: #39227d;
$color-3: #565e72;
$color-4: #323a4b;
$color-5: #03aefe;

TAILWIND

colors: {
  'brand-1': '#5a01c6',
  'brand-2': '#39227d',
  'brand-3': '#565e72',
  'brand-4': '#323a4b',
  'brand-5': '#03aefe',
}

RGB Array

[90, 1, 198], [57, 34, 125], [86, 94, 114], [50, 58, 75], [3, 174, 254]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #5A01C6, #39227D, #565E72, #323A4B, #03AEFE is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #5a01c6; --color-2: #39227d; --color-3: #565e72; --color-4: #323a4b; --color-5: #03aefe. 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 cool-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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