Grid

Radar Grid

A radar scope as a floor: range rings, spokes, a rotating sweep arm and contact blips that flare as the beam passes.

Settings and defaults

Spokes
24
Sweep Width
0.13
Blip Density
0.08
Cell Size
2.5
Line Width
1
Section Size
4
Section Width
1.8
Line Mode
1
Cell Mode
0
Anim Speed
1
Anim Scale
0.5
Anim Intensity
1
Fade Distance
24
Fade Strength
0.25
Displace
0
Size
50
Line Color
#1a805a
Section Color
#80ffb8
Cell Color
#0d3324
Glow Color
#59ff99
Bg Color
#020d08
Bg Opacity
0.25
Reveal
1
Reveal Duration
0

The Radar Grid turns the floor into a radar screen. Concentric range rings and radial spokes fill a round disc framed by a bezel with tick marks and a crosshair. A sweep arm turns around the centre, leaving a fading green trail, and contacts scattered across the scope flare up as the arm passes over them and then fade until it comes round again.

How it works

The disc is drawn in polar terms: rings at a fixed spacing out from the centre and spokes at equal angles around it, with every few rings drawn as a heavier major ring. The radius of the disc is the Fade Distance, so the scope keeps its frame while the field inside it fades. Each blip sits in its own ring-and-spoke sector, and its glow is measured from the moment the arm last crossed it.

Settings

  • Spokes is the number of radial lines; 0 removes them.
  • Sweep Width is the length of the trail behind the arm, as a share of a full turn; 0 hides the sweep.
  • Blip Density is the chance that a sector holds a contact.
  • Line Mode: Ripple sends ping rings out from the centre, Scan lights the spokes one after another like a sector scan.
  • Anim Speed sets how fast the arm turns.

Use it for

Security and defence tech, monitoring and analytics dashboards, sci-fi command rooms and game interfaces. Pair it with a hologram or the Holographic Crosshair cursor.

Code and API

Ready-to-paste React Three Fiber code and the 3DRise API are included in paid plans, inside the studio.

See plans

More grids

Works well with

Used in