← Back to Editor

#4B07C4 · #112438 · #62A689 · #174566 · #71E3C1

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

#4B07C4

Deep Indigo · DarkViolet · Eggplant

HEX
#4B07C4
RGB
rgb(75, 7, 196)
HSL
hsl(262, 93%, 40%)
HSB
hsb(262, 96%, 77%)
CMYK
cmyk(62%, 96%, 0%, 23%)
Oklch
oklch(41.4% 0.239 284.5)

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

#112438

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#112438
RGB
rgb(17, 36, 56)
HSL
hsl(211, 53%, 14%)
HSB
hsb(211, 70%, 22%)
CMYK
cmyk(70%, 36%, 0%, 78%)
Oklch
oklch(25.5% 0.046 251.1)

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

#62A689

Mineral Blue · CadetBlue · Olive Green

HEX
#62A689
RGB
rgb(98, 166, 137)
HSL
hsl(154, 28%, 52%)
HSB
hsb(154, 41%, 65%)
CMYK
cmyk(41%, 0%, 17%, 35%)
Oklch
oklch(67.1% 0.082 165.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#174566

Lake Blue · DarkSlateGray · Prussian Blue

HEX
#174566
RGB
rgb(23, 69, 102)
HSL
hsl(205, 63%, 25%)
HSB
hsb(205, 77%, 40%)
CMYK
cmyk(77%, 32%, 0%, 60%)
Oklch
oklch(37.6% 0.075 243.7)

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

#71E3C1

Jade · MediumAquaMarine · Lake Green

HEX
#71E3C1
RGB
rgb(113, 227, 193)
HSL
hsl(162, 67%, 67%)
HSB
hsb(162, 50%, 89%)
CMYK
cmyk(50%, 0%, 15%, 11%)
Oklch
oklch(83.9% 0.116 171.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B07C4
7FC507

Analogous

0720C5
4B07C4
AC07C5

Triadic

4B07C4
C54D07
07C54D

Split-Comp.

4B07C4
C5AC07
20C507

Tetradic

4B07C4
C50720
7FC507
07C5AC

Contrast Matrix WCAG 2.1 Contrast

4B07C4
112438
62A689
174566
71E3C1
—
1.6
Fail
3.4
AA Large
1.0
Fail
6.3
AA
1.6
Fail
—
5.5
AA
1.6
Fail
10.1
AAA
3.4
AA Large
5.5
AA
—
3.5
AA Large
1.8
Fail
1.0
Fail
1.6
Fail
3.5
AA Large
—
6.5
AA
6.3
AA
10.1
AAA
1.8
Fail
6.5
AA
—
White BG
9.9AAA
15.8AAA
2.9Fail
10.1AAA
1.6Fail
Black BG
2.1Fail
1.3Fail
7.3AAA
2.1Fail
13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2D96
191933
7F8090
2B2B5E
A2A3C9

Deuteranopia

32378B
181732
7C7692
28255C
9C93CB

Tritanopia

48726A
122F2F
659697
195856
77D0D1

Achromatopsia

313131
212121
8E8E8E
3B3B3B
BDBDBD

Shades & Tints Shades & Tints

#4B07C4

Dark
Light

#112438

Dark
Light

#62A689

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b07c4;
  --color-2: #112438;
  --color-3: #62a689;
  --color-4: #174566;
  --color-5: #71e3c1;
}

SCSS

$color-1: #4b07c4;
$color-2: #112438;
$color-3: #62a689;
$color-4: #174566;
$color-5: #71e3c1;

TAILWIND

colors: {
  'brand-1': '#4b07c4',
  'brand-2': '#112438',
  'brand-3': '#62a689',
  'brand-4': '#174566',
  'brand-5': '#71e3c1',
}

RGB Array

[75, 7, 196], [17, 36, 56], [98, 166, 137], [23, 69, 102], [113, 227, 193]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B07C4, #112438, #62A689, #174566, #71E3C1 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #4b07c4; --color-2: #112438; --color-3: #62a689; --color-4: #174566; --color-5: #71e3c1. 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. 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