Neon Color Palette

Neon palettes put maximum-chroma hues — hot pink, cyan, lime, electric violet — on a near-black background, where they appear to glow. Screens can show very saturated colors, but only at mid-to-high lightness, so the generator keeps them there.

Colors

Describe your project and let AI pick the colors

Try:

See it on a page

Lightest color becomes the background, darkest the text, the most saturated one the button.

NorthwindPricing · Docs · Blog

Ship the release notes your users actually read.

Body text in your darkest color on your lightest: 17.66:1 AA pass

Start freeSee a demo

Surface card with a secondary accent

Export

CSS custom properties, Tailwind v4 @theme (in OKLCH), Tailwind v3 config, JSON or SCSS.

:root {
  --color-black: #0B0221;
  --color-midnight-blue: #2B0F54;
  --color-deep-pink: #FF2A6D;
  --color-dark-turquoise: #05D9E8;
  --color-light-cyan: #D1F7FF;
}

Contrast between every pair

WCAG 2.2: 4.5:1 for body text (AA), 3:1 for large text and UI parts, 7:1 for AAA.

Contrast ratio of every text color (rows) on every background (columns)
Text / background	#0B0221	#2B0F54	#FF2A6D	#05D9E8	#D1F7FF
#0B0221		Aa1.24:1Fail	Aa5.55:1AA	Aa11.57:1AAA	Aa17.66:1AAA
#2B0F54	Aa1.24:1Fail		Aa4.46:1Large	Aa9.31:1AAA	Aa14.20:1AAA
#FF2A6D	Aa5.55:1AA	Aa4.46:1Large		Aa2.08:1Fail	Aa3.18:1Large
#05D9E8	Aa11.57:1AAA	Aa9.31:1AAA	Aa2.08:1Fail		Aa1.52:1Fail
#D1F7FF	Aa17.66:1AAA	Aa14.20:1AAA	Aa3.18:1Large	Aa1.52:1Fail

Get an AI critique of this palette

The contrast numbers are calculated exactly in your browser and passed to the AI, so its advice starts from real ratios.

What is it for? (optional)

Hand-picked neon palettes

Synthwave

17.66:1 text contrast · Edit in generator

Rave

18.15:1 text contrast · Edit in generator

Tokyo night

16.88:1 text contrast · Edit in generator

Tips for neon palettes

Always put neon on a dark background (near-black with a slight blue or purple tint).
Neon on white usually fails contrast as text and looks harsh.
Two or three neons are enough; more turns into noise.

Want one written for your project? Describe it on the AI palette generator, then check it with the accessible palette checker.

Frequently asked questions

What are the hex codes for neon colors?

Common screen neons: neon pink #FF2A6D, cyan #05D9E8, neon green #39FF14, magenta #FF00E6 and electric violet #7A04EB. True fluorescent ink cannot be reproduced exactly on screens or in CMYK print.

Do neon colors pass WCAG contrast?

On black, most do comfortably (neon green on black is above 15:1). On white, most fail as text. Check the contrast grid on this page for your exact palette.