← Back to Editor

#E30F73 · #004339 · #1F675C · #81A778 · #BBC69B

neon

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebelliousWarmCool

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign PageData Visualization

Color Details Color Details

#E30F73

Dark Violet · MediumVioletRed · Camellia

HEX
#E30F73
RGB
rgb(227, 15, 115)
HSL
hsl(332, 88%, 47%)
HSB
hsb(332, 93%, 89%)
CMYK
cmyk(0%, 93%, 49%, 11%)
Oklch
oklch(59.5% 0.235 2.3)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#004339

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#004339
RGB
rgb(0, 67, 57)
HSL
hsl(171, 100%, 13%)
HSB
hsb(171, 100%, 26%)
CMYK
cmyk(100%, 0%, 15%, 74%)
Oklch
oklch(34.3% 0.063 178.7)

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

#1F675C

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#1F675C
RGB
rgb(31, 103, 92)
HSL
hsl(171, 54%, 26%)
HSB
hsb(171, 70%, 40%)
CMYK
cmyk(70%, 0%, 11%, 60%)
Oklch
oklch(46.7% 0.072 180.9)

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

#81A778

Celadon · DarkSeaGreen · Olive Green

HEX
#81A778
RGB
rgb(129, 167, 120)
HSL
hsl(109, 21%, 56%)
HSB
hsb(109, 28%, 65%)
CMYK
cmyk(23%, 0%, 28%, 35%)
Oklch
oklch(68.8% 0.079 139.7)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#BBC69B

Willow Green · Tan · Apple Green

HEX
#BBC69B
RGB
rgb(187, 198, 155)
HSL
hsl(75, 27%, 69%)
HSB
hsb(75, 22%, 78%)
CMYK
cmyk(6%, 0%, 22%, 22%)
Oklch
oklch(80.7% 0.059 119.4)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E30F73
0EE17F

Analogous

E10EDA
E30F73
E1150E

Triadic

E30F73
71E10E
0E71E1

Split-Comp.

E30F73
0EE115
0EDAE1

Tetradic

E30F73
DAE10E
0EE17F
150EE1

Contrast Matrix WCAG 2.1 Contrast

E30F73
004339
1F675C
81A778
BBC69B
—
2.5
Fail
1.5
Fail
1.7
Fail
2.5
Fail
2.5
Fail
—
1.7
Fail
4.2
AA Large
6.3
AA
1.5
Fail
1.7
Fail
—
2.5
Fail
3.7
AA Large
1.7
Fail
4.2
AA Large
2.5
Fail
—
1.5
Fail
2.5
Fail
6.3
AA
3.7
AA Large
1.5
Fail
—
White BG
4.6AA
11.3AAA
6.7AA
2.7Fail
1.8Fail
Black BG
4.6AA
1.9Fail
3.2AA Large
7.7AAA
11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

87855B
1D1E3B
3E3F5F
919283
C0C0A5

Deuteranopia

94A355
19143C
3A355F
8F8C86
BFBEA8

Tritanopia

D84844
033D3E
236161
838C8E
BCAEAF

Achromatopsia

5A5A5A
2E2E2E
505050
969696
BEBEBE

Shades & Tints Shades & Tints

#E30F73

Dark
Light

#004339

Dark
Light

#1F675C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e30f73;
  --color-2: #004339;
  --color-3: #1f675c;
  --color-4: #81a778;
  --color-5: #bbc69b;
}

SCSS

$color-1: #e30f73;
$color-2: #004339;
$color-3: #1f675c;
$color-4: #81a778;
$color-5: #bbc69b;

TAILWIND

colors: {
  'brand-1': '#e30f73',
  'brand-2': '#004339',
  'brand-3': '#1f675c',
  'brand-4': '#81a778',
  'brand-5': '#bbc69b',
}

RGB Array

[227, 15, 115], [0, 67, 57], [31, 103, 92], [129, 167, 120], [187, 198, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #E30F73, #004339, #1F675C, #81A778, #BBC69B is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #e30f73; --color-2: #004339; --color-3: #1f675c; --color-4: #81a778; --color-5: #bbc69b. 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 neon-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