← Back to Editor

#8FF2E5 · #14D8BD · #4F14D9 · #350E8F · #12003B

dark

A 5-color dark 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

#8FF2E5

Jade · SkyBlue · Lake Green

HEX
#8FF2E5
RGB
rgb(143, 242, 229)
HSL
hsl(172, 79%, 75%)
HSB
hsb(172, 41%, 95%)
CMYK
cmyk(41%, 0%, 5%, 5%)
Oklch
oklch(89.7% 0.096 184.9)

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

#14D8BD

Mineral Blue · DarkTurquoise · Mint Ice

HEX
#14D8BD
RGB
rgb(20, 216, 189)
HSL
hsl(172, 83%, 46%)
HSB
hsb(172, 91%, 85%)
CMYK
cmyk(91%, 0%, 12%, 15%)
Oklch
oklch(79.1% 0.142 179.2)

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

#4F14D9

Deep Indigo · DarkViolet · Navy Blue

HEX
#4F14D9
RGB
rgb(79, 20, 217)
HSL
hsl(258, 83%, 46%)
HSB
hsb(258, 91%, 85%)
CMYK
cmyk(64%, 91%, 0%, 15%)
Oklch
oklch(44.8% 0.255 282.4)

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

#350E8F

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#350E8F
RGB
rgb(53, 14, 143)
HSL
hsl(258, 82%, 31%)
HSB
hsb(258, 90%, 56%)
CMYK
cmyk(63%, 90%, 0%, 44%)
Oklch
oklch(33.5% 0.184 284.1)

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

#12003B

Deep Indigo · MidnightBlue · Deep Sea Blue

HEX
#12003B
RGB
rgb(18, 0, 59)
HSL
hsl(258, 100%, 12%)
HSB
hsb(258, 100%, 23%)
CMYK
cmyk(69%, 100%, 0%, 77%)
Oklch
oklch(17.8% 0.103 286.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8FF2E5
F28D9A

Analogous

8DF2B2
8FF2E5
8DCDF2

Triadic

8FF2E5
E48DF2
F2E48D

Split-Comp.

8FF2E5
F28DCD
F2B28D

Tetradic

8FF2E5
B28DF2
F28D9A
CDF28D

Contrast Matrix WCAG 2.1 Contrast

8FF2E5
14D8BD
4F14D9
350E8F
12003B
—
1.4
Fail
6.6
AA
9.9
AAA
14.7
AAA
1.4
Fail
—
4.8
AA
7.2
AAA
10.6
AAA
6.6
AA
4.8
AA
—
1.5
Fail
2.2
Fail
9.9
AAA
7.2
AAA
1.5
Fail
—
1.5
Fail
14.7
AAA
10.6
AAA
2.2
Fail
1.5
Fail
—
White BG
1.3Fail
1.8Fail
8.6AAA
13.0AAA
19.3AAA
Black BG
16.0AAA
11.6AAA
2.4Fail
1.6Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABBE8
696BC4
3535A9
242470
0A0A2D

Deuteranopia

B4ADE9
5E4FC5
393D9E
262968
0B0D29

Tritanopia

94EBEB
1EC9CA
4C847B
335752
11211F

Achromatopsia

D3D3D3
9A9A9A
3C3C3C
282828
0C0C0C

Shades & Tints Shades & Tints

#8FF2E5

Dark
Light

#14D8BD

Dark
Light

#4F14D9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8ff2e5;
  --color-2: #14d8bd;
  --color-3: #4f14d9;
  --color-4: #350e8f;
  --color-5: #12003b;
}

SCSS

$color-1: #8ff2e5;
$color-2: #14d8bd;
$color-3: #4f14d9;
$color-4: #350e8f;
$color-5: #12003b;

TAILWIND

colors: {
  'brand-1': '#8ff2e5',
  'brand-2': '#14d8bd',
  'brand-3': '#4f14d9',
  'brand-4': '#350e8f',
  'brand-5': '#12003b',
}

RGB Array

[143, 242, 229], [20, 216, 189], [79, 20, 217], [53, 14, 143], [18, 0, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #8FF2E5, #14D8BD, #4F14D9, #350E8F, #12003B 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: #8ff2e5; --color-2: #14d8bd; --color-3: #4f14d9; --color-4: #350e8f; --color-5: #12003b. 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 dark-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