Neon hex: a cyan hexagon grid with scanlines on near-black
Neon hex looks like a heads-up display. A honeycomb of cyan hexagon outlines, thin at Weight 30 and tight at Spacing 120, covers a near-black blue, and a Radial fade keeps it brightest around the pattern origin and lets it sink into darkness toward the corners. The hero is a spiky ten-ray Burst in the same cyan, outline only with a Stroke width of 2, and white Scanlines at 30 opacity in Screen blend run across everything like an old monitor.
Make it yours
Bring in the hidden pink
The preset stores a hot pink in Secondary color that you never see, because Fill is Outline. Choose Gradient and the burst fills with a cyan-to-pink blend, which adds a second neon without touching the grid.
Center the grid on the burst
The Radial fade follows the pattern origin, currently the middle of the frame. Move Pattern origin X to 0.72 to match the burst: the honeycomb lights up around the shape while the left side goes dark for text.
FAQ
Does the Neon hex background animate?
No. Everything this tool makes is a static graphic, including the scanlines, which are a fixed overlay of thin white bars. That keeps it light and avoids motion concerns on product surfaces. If you want movement, treat it as a backdrop and animate the interface elements you place on top of it.
How it works
Build the pattern
Pick a motif and a square, brick or hex layout, then set scale, spacing, weight, rotation, two pattern colors and a background.
Add a shape and a texture
Place one of 8 shapes with a solid, outline or gradient fill, then layer one of 9 textures with a blend mode and opacity.
Frame and use it
Choose a ratio from 1:1 to 9:16, preview it in hero, card and mobile layouts, then sign in with a free UX Pilot account to use it on the canvas or export it.