← Back to Editor

#A0FF21 · #21FF81 · #219FFF · #8121FF · #FF219F

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#A0FF21

Grass Green · GreenYellow · Olive Green

HEX
#A0FF21
RGB
rgb(160, 255, 33)
HSL
hsl(86, 100%, 56%)
HSB
hsb(86, 87%, 100%)
CMYK
cmyk(37%, 0%, 87%, 0%)
Oklch
oklch(90.6% 0.244 131.9)

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

#21FF81

Emerald · MediumSpringGreen · Olive Green

HEX
#21FF81
RGB
rgb(33, 255, 129)
HSL
hsl(146, 100%, 56%)
HSB
hsb(146, 87%, 100%)
CMYK
cmyk(87%, 0%, 49%, 0%)
Oklch
oklch(87.7% 0.231 150.9)

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

#219FFF

Lake Blue · DodgerBlue · Navy Blue

HEX
#219FFF
RGB
rgb(33, 159, 255)
HSL
hsl(206, 100%, 56%)
HSB
hsb(206, 87%, 100%)
CMYK
cmyk(87%, 38%, 0%, 0%)
Oklch
oklch(68.5% 0.174 248.1)

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

#8121FF

Deep Indigo · DarkViolet · Violet

HEX
#8121FF
RGB
rgb(129, 33, 255)
HSL
hsl(266, 100%, 56%)
HSB
hsb(266, 87%, 100%)
CMYK
cmyk(49%, 87%, 0%, 0%)
Oklch
oklch(54.3% 0.283 293.4)

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

#FF219F

Rose Purple · DeepPink · Rose Pink

HEX
#FF219F
RGB
rgb(255, 33, 159)
HSL
hsl(326, 100%, 56%)
HSB
hsb(326, 87%, 100%)
CMYK
cmyk(0%, 87%, 38%, 0%)
Oklch
oklch(66.3% 0.260 353.6)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A0FF21
801FFF

Analogous

FFF01F
A0FF21
2EFF1F

Triadic

A0FF21
1F9EFF
FF1F9E

Split-Comp.

A0FF21
1F2EFF
F01FFF

Tetradic

A0FF21
1FFFF0
801FFF
FF1F2E

Contrast Matrix WCAG 2.1 Contrast

A0FF21
21FF81
219FFF
8121FF
FF219F
—
1.1
Fail
2.3
Fail
4.7
AA
2.8
Fail
1.1
Fail
—
2.1
Fail
4.4
AA Large
2.6
Fail
2.3
Fail
2.1
Fail
—
2.1
Fail
1.3
Fail
4.7
AA
4.4
AA Large
2.1
Fail
—
1.7
Fail
2.8
Fail
2.6
Fail
1.3
Fail
1.7
Fail
—
White BG
1.2Fail
1.3Fail
2.8Fail
5.8AA
3.5AA Large
Black BG
16.8AAA
15.7AAA
7.5AAA
3.6AA Large
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9CA57
81839F
5859E8
5757C9
9F9D81

Deuteranopia

C4BD64
7464A7
5047E2
5D64BC
ACBC79

Tritanopia

A5818A
2CB8BD
27D5D1
7C9F96
F46863

Achromatopsia

C9C9C9
AEAEAE
848484
575757
727272

Shades & Tints Shades & Tints

#A0FF21

Dark
Light

#21FF81

Dark
Light

#219FFF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a0ff21;
  --color-2: #21ff81;
  --color-3: #219fff;
  --color-4: #8121ff;
  --color-5: #ff219f;
}

SCSS

$color-1: #a0ff21;
$color-2: #21ff81;
$color-3: #219fff;
$color-4: #8121ff;
$color-5: #ff219f;

TAILWIND

colors: {
  'brand-1': '#a0ff21',
  'brand-2': '#21ff81',
  'brand-3': '#219fff',
  'brand-4': '#8121ff',
  'brand-5': '#ff219f',
}

RGB Array

[160, 255, 33], [33, 255, 129], [33, 159, 255], [129, 33, 255], [255, 33, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A0FF21, #21FF81, #219FFF, #8121FF, #FF219F is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #a0ff21; --color-2: #21ff81; --color-3: #219fff; --color-4: #8121ff; --color-5: #ff219f. 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. 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