Concentric Rings
Nested colored arcs sweep, open and settle into one plane while every ring or group can follow its own part of the music.
Concentric Rings layers thin colored arcs around one center. A smooth aperture wave travels from the inner rings to the outer rings, so gaps open and close in sequence instead of moving as one rigid stack. Assign each ring separately, or divide the radius into four groups, then choose Bass, Mid, High, Volume, automatic spectrum placement, or an exact custom frequency. Optional snare and hi-hat triggers launch the rings through depth and settle them back into the common plane. Concentric Rings requires WebGPU; see Browser Support for current platform details.
Open Concentric Rings
Launch the visualizer with its matching left-nav entry selected.
Quick start
- Start the demo track, choose a local audio file, or enable a live input.
- Try a preset or style first, then open the section for the part of the image you want to change.
- On a control with Assign modulation, open the source picker, choose a signal, and watch the slider's live fill.
- Use Reset to Defaults whenever you want to return to the original look.
Presets and styles
Chromatic Aperture · Violet Radar · Cyan Mirror · Solar Counterflow · Snare Launch · Deep Spectrum
Audio modulation
On a control with Assign modulation, select the activity icon to open Modulate with. Choose a named source, or choose — None to leave the control unmodulated. After you assign one, its name appears below the slider; select that name to edit the route, or use Clear modulation to remove it. The slider track shows the live signal reaching the control.
| Modulated control | Section | What the route changes |
|---|---|---|
| Ring Spacing | Rings | Sets the spacing between visible elements. |
| Line Thickness | Rings | Sets the visible line thickness. |
| Halo Brightness | Rings | Sets the visible strength of halo brightness. |
| Halo Width | Rings | Sets the visible halo width. |
| Base Arc Length | Motion | Sets the resting fraction of each circumference that is drawn, leaving a gap that makes rotation and growth legible. |
| Aperture Wave | Motion | Opens and closes successive radii as a smooth traveling wave. |
| Rotation Speed | Motion | Sets how quickly rotation changes or moves. |
| Radial Stagger | Motion | Offsets neighboring rings in rotation and in the aperture wave, changing the stack from aligned gaps to a spiral-like sequence. |
| Audio Arc Growth | Audio | Adds arc length from each ring or group assignment while its signal is active. |
| Waveform Etch | Audio | Etches the shared live waveform around each visible arc instead of scaling the whole stack. |
| Radius Response | Audio | Sets the visible radius response. |
| Audio Brightness | Audio | Sets the visible strength of audio brightness. |
| Flight Depth | Depth Flight | Sets the visible flight depth. |
| Settle Speed | Depth Flight | Sets how quickly settle changes or moves. |
| Zoom Amount | View | Sets the visual zoom amount. |
| Color Cycle | Color | Moves the inner-to-outer color gradient through the ring stack; negative values reverse it. |
Settings reference
Rings
| Setting | Available values | What it changes |
|---|---|---|
| Ring Count | 8–64 | Sets the number of independently animated rings. |
| Arc Detail | 48–192 | Sets how smoothly each arc bends around its circumference. |
| Inner Radius | 0.2–1.5 | Sets the visible inner radius. |
| Ring Spacing | 0.035–0.22 | Sets the spacing between visible elements. Use Assign modulation to choose a source. |
| Line Thickness | 0.003–0.04 | Sets the visible line thickness. Use Assign modulation to choose a source. |
| Halo Brightness | 0–0.58 | Sets the visible strength of halo brightness. Use Assign modulation to choose a source. |
| Halo Width | 1–6 | Sets the visible halo width. Use Assign modulation to choose a source. |
Motion
| Setting | Available values | What it changes |
|---|---|---|
| Growth Direction | CLOCKWISE, COUNTERCLOCKWISE, MIRRORED / BIDIRECTIONAL, ALTERNATING | Chooses clockwise, counterclockwise, centered mirrored growth, or alternating directions on neighboring rings. |
| Base Arc Length | 0.05–0.98 | Sets the resting fraction of each circumference that is drawn, leaving a gap that makes rotation and growth legible. Use Assign modulation to choose a source. |
| Aperture Wave | 0–0.42 | Opens and closes successive radii as a smooth traveling wave. Use Assign modulation to choose a source. |
| Aperture Speed | 0–1 | Sets how fast the opening and closing wave travels through the ring stack. |
| Rotation Speed | -1–1 | Sets how quickly rotation changes or moves. Use Assign modulation to choose a source. |
| Radial Stagger | 0–0.8 | Offsets neighboring rings in rotation and in the aperture wave, changing the stack from aligned gaps to a spiral-like sequence. Use Assign modulation to choose a source. |
Audio
| Setting | Available values | What it changes |
|---|---|---|
| Frequency Mode | INDIVIDUAL RINGS, FOUR GROUPS | Switches between editing every ring independently and assigning four reusable frequency groups. |
| Group Arrangement | RADIAL, ALTERNATING, MIRRORED | Places the four groups in radial blocks, alternates them ring by ring, or mirrors group membership from the inner and outer edges. |
| Audio Arc Growth | 0–0.75 | Adds arc length from each ring or group assignment while its signal is active. Use Assign modulation to choose a source. |
| Waveform Etch | 0–0.3 | Etches the shared live waveform around each visible arc instead of scaling the whole stack. Use Assign modulation to choose a source. |
| Radius Response | 0–0.45 | Sets the visible radius response. Use Assign modulation to choose a source. |
| Response Smoothing | 0–0.98 | Balances immediate audio response against steadier motion. |
| Audio Brightness | 0–1.5 | Sets the visible strength of audio brightness. Use Assign modulation to choose a source. |
| Selected Ring | 1–64 | Chooses the ring whose source and optional exact frequency you are editing in Individual Rings mode. |
| Ring Source | Auto Spectrum · Bass · Mid · High · Volume · Custom Frequency | Assigns a signal to the selected ring. Custom Frequency samples the shared spectrum at the entered hertz value. |
| Group 1–4 Source | Auto Spectrum · Bass · Mid · High · Volume · Custom Frequency | Assigns one signal to each group when Four Groups mode is selected. |
| Custom Frequency | 30–16000 Hz | Sets the exact frequency sampled by the selected ring or group. |
Depth Flight
| Setting | Available values | What it changes |
|---|---|---|
| Flight Trigger | OFF, ON LOAD, SNARE ONSET, HI-HAT ONSET | Chooses whether depth flight is off, runs when the look loads, or launches from a detected snare or hi-hat onset. |
| Flight Origin | FROM BEHIND CAMERA, FROM FAR PLANE | Starts rings beyond the camera and sends them through the lens, or starts them at the far side of the ring plane. |
| Flight Depth | 1–16 | Sets the visible flight depth. Use Assign modulation to choose a source. |
| Settle Speed | 0.2–4 | Sets how quickly settle changes or moves. Use Assign modulation to choose a source. |
| Ring Stagger | 0–0.1 | Delays each successive ring so the stack flies and settles as a depth wave. |
View
| Setting | Available values | What it changes |
|---|---|---|
| Tilt X | -0.8–0.8 | Sets the tilt x of the visible composition. |
| Tilt Y | -0.8–0.8 | Sets the tilt y of the visible composition. |
| Camera Distance | 6–16 | Sets how far the camera sits from the subject. |
| Zoom Trigger | OFF, SNARE ONSET, HI-HAT ONSET, VOLUME | Chooses the onset or level that moves the camera independently of ring flight. |
| Zoom Amount | 0–3 | Sets the visual zoom amount. Use Assign modulation to choose a source. |
| Zoom Release | 0.02–1.5 | Sets the visual zoom release. |
Color
| Setting | Available values | What it changes |
|---|---|---|
| Inner Color | Color | Sets the inner color. |
| Outer Color | Color | Sets the outer color. |
| Color Cycle | -0.5–0.5 | Moves the inner-to-outer color gradient through the ring stack; negative values reverse it. Use Assign modulation to choose a source. |
Composite
| Setting | Available values | What it changes |
|---|---|---|
| Background Opacity | 0–1 | Sets how transparent the background appears. |
Some controls appear only after you enable a related mode or style. The settings panel always reflects the options available for the current selection.
Tips for a better audio visualization
- Use Individual Rings to pick any ring and give it an exact frequency, or choose Four Groups for quicker radial, alternating or mirrored assignments.
- Raise Aperture Wave and Radial Stagger for a stronger spiral-like opening sequence; keep Base Arc Length below a full circle so the motion stays readable.
- Choose Snare Launch, then set Flight Origin to From Behind Camera to send each ring through the lens before it settles exactly into the shared plane.