Halo Grid: a diamond lattice of mint rings that swell toward the center
A strict lattice of outlined circles, turned 45 degrees so the rows read as diamonds: that is Halo Grid. Ring size depends on distance, so near the focal point at 50 by 48 the rings swell into wide halos and toward the corners they shrink to small loops. Mint strokes, with every fourth row in periwinkle, glow against dark navy, and Grain is nearly off at 1 to keep the lines clean.
Make it yours
Square the lattice up
Rotation at 45 is what turns the grid into diamonds. Set Rotation to 0 and the same rings line up in plain rows and columns, a more neutral order that suits dashboards and documentation.
Make the rings bolder
Tension controls stroke weight and is low at 22, giving fine lines. Around 60 the rings become thick hoops that hold up at small sizes, such as the Mobile preview or a social crop.
FAQ
How does Halo Grid move when it plays?
A slow ripple travels outward from the focal point: each ring grows and shrinks slightly in turn, based on its distance from the center, while the lattice itself stays put. Speed at 16 keeps the pulse gentle. For a static pattern, for example in a layout where motion would distract, bring Speed to 0.
How it works
Pick a visual system
Choose one of 20 families such as Echo Rings, Halo Grid, Particle Coast, Glyph Terrain or Ribbon Stack.
Compose it
Choose a balanced, focal, edge or repeat composition, move the focal point and set density, scale, rotation, rhythm, tension, depth and grain.
Judge it in context and use it
Preview it in product, landing, AI and mobile layouts, then sign in with a free UX Pilot account to use it on the canvas or export it.