Hyper Forest

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

#Neon#Futuristic#Bold
Open in Generator
COLOR 1
#F8CA13
Kodak Yellow
COLOR 2
#77F944
Alien Green
COLOR 3
#1DECC3
Aquamarine
COLOR 4
#486AF3
Brand Blue
COLOR 5
#E00BFD
Synthwave Magenta

Color Values & Codes

HEX · RGB · HSL
rgb(248, 202, 19)hsl(48, 94%, 52%)Color details →
rgb(119, 249, 68)hsl(103, 94%, 62%)Color details →
Aquamarine
#1DECC3
rgb(29, 236, 195)hsl(168, 84%, 52%)Color details →
Brand Blue
#486AF3
rgb(72, 106, 243)hsl(228, 88%, 62%)Color details →
rgb(224, 11, 253)hsl(293, 98%, 52%)Color details →

CSS Variables

Copy & paste directly into your stylesheet
:root {
  --color-1: #F8CA13;
  --color-2: #77F944;
  --color-3: #1DECC3;
  --color-4: #486AF3;
  --color-5: #E00BFD;
}

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
#F8CA13 on #486AF32.90:1
Large Text Only (Fail)
Sample Text
#F8CA13 on #E00BFD2.39:1
Large Text Only (Fail)
Sample Text
#77F944 on #486AF33.33:1
Large Text Only (Pass)
Sample Text
#77F944 on #E00BFD2.74:1
Large Text Only (Fail)
Sample Text
#1DECC3 on #486AF32.99:1
Large Text Only (Fail)
Sample Text
#1DECC3 on #E00BFD2.46:1
Large Text Only (Fail)