Glow Garden

neon palette with a balanced five-color hierarchy for design use.

#Neon#Futuristic#Bold
Open in Generator
COLOR 1
#0FFD16
Lime
COLOR 2
#4BF2E9
Turquoise
COLOR 3
#1D16F3
Blue
COLOR 4
#F943F6
Neon Pink
COLOR 5
#F72A11
Ferrari Red

Color Values & Codes

HEX · RGB · HSL
Lime
#0FFD16
rgb(15, 253, 22)hsl(122, 98%, 53%)Color details →
Turquoise
#4BF2E9
rgb(75, 242, 233)hsl(177, 87%, 62%)Color details →
Blue
#1D16F3
rgb(29, 22, 243)hsl(242, 90%, 52%)Color details →
Neon Pink
#F943F6
rgb(249, 67, 246)hsl(301, 94%, 62%)Color details →
rgb(247, 42, 17)hsl(7, 93%, 52%)Color details →

CSS Variables

Copy & paste directly into your stylesheet
:root {
  --color-1: #0FFD16;
  --color-2: #4BF2E9;
  --color-3: #1D16F3;
  --color-4: #F943F6;
  --color-5: #F72A11;
}

Role-Based WCAG Contrast Audit

Accessibility contrast depends on assigned UI roles. Here are the contrast ratios and WCAG compliance ratings when pairing palette colors as Foreground Text against Background surfaces:

Sample Text
#0FFD16 on #F943F62.11:1
Large Text Only (Fail)
Sample Text
#0FFD16 on #F72A112.85:1
Large Text Only (Fail)
Sample Text
#4BF2E9 on #F943F62.12:1
Large Text Only (Fail)
Sample Text
#4BF2E9 on #F72A112.87:1
Large Text Only (Fail)
Sample Text
#1D16F3 on #F943F62.91:1
Large Text Only (Fail)
Sample Text
#1D16F3 on #F72A112.15:1
Large Text Only (Fail)