OBS browser source builder

Trace the
signal.

Orbit the visible edge of any OBS source with activity-driven synthwave stars. Build the URL here, then paste it into a full-canvas browser source.

OBS transform tracking
Twitch + YouTube activity
One-shot edge analysis

Signal routing

Build your source URL

Changes update the URL instantly.

OBS source name Match the source name exactly. Nested scenes and groups are supported.

01 OBS WebSocket

Protocol

Host

Port

OBS WebSocket password

02 Streamer.bot WebSocket

Streamer.bot protocol

Host

Port

Streamer.bot WebSocket password

03 Activity response

Additional bot names Comma-delimited. The built-in list already includes common chat bots.

Window (seconds)

Minimum stars

★

Maximum stars

★

Fade (ms)

04 Visual channel

Color theme

Trail character

Advanced motion + edge controls Use the tuned defaults unless you want a different orbit feel.

Minimum speed

orb/s

Maximum speed

orb/s

Minimum spin

rad/s

Maximum spin

rad/s

Trail duration (seconds)

Render rate (FPS)

fps

Render scale

Orbit altitude (px)

Altitude spread (px)

Altitude drift (px)

Edge gravity

Orbit damping

Alpha threshold

Analysis size

Show a sanitized connection status in the overlay

Visual simulator

Live preview

shader

Simulated users 12

Source visible

Browser source output

live

Your overlay URL

Paste this into the URL field of an OBS browser source. Set its width and height to match your OBS base canvas.

Keep this URL private. Passwords are placed after # so they are not sent to GitHub Pages, but they remain visible in the copied URL.

Open overlay

URL ready

LAN preview

Run npm run dev -- --host 0.0.0.0, then open this builder from the streaming PC using this computer’s LAN IP.