Set Up Your Overlay

Get your 4thRock overlay running in OBS in under 5 minutes.

Step 1: Log In to the Dashboard

Go to 4throck.cloud/widgets and log in with your account. If you don't have one yet, create a free account — no credit card required.

Step 2: Add Widgets in the Compositor

The Compositor is where you arrange your overlay. Open it from the left sidebar.

1. Click Add Widget to open the widget picker.
2. Choose the widgets you want — Chat, Alerts, TTS, Media, etc.
3. Drag and resize each widget to position it on the canvas.
4. Use the Layers panel on the right to control z-order and visibility.

The canvas represents your full 1920×1080 stream frame. What you see is what OBS will render.

Step 3: Save a Preset (Optional)

If you run multiple scenes or want different layouts for different content, save your current layout as a Preset using the preset dropdown at the top of the Compositor. You can switch presets live without changing your OBS setup.

Step 4: Copy Your Overlay URL

At the top of the Compositor, click Copy Overlay URL. Your URL looks like this:

https://4throck.cloud/widgets/compositor/overlay?key=YOUR_KEY

This URL is unique to your account. Anyone with it can view your overlay, so keep it private.

Step 5: Add as a Browser Source in OBS

1. In OBS, add a new Browser Source to your scene.
2. Paste your overlay URL into the URL field.
3. Set the dimensions to 1920 × 1080.
4. Check "Shutdown source when not visible" if you want to pause the overlay when the source is hidden.
5. Check "Refresh browser when scene becomes active" to reload widgets when switching scenes.
6. Enable "Interact" if you want to click through the overlay for testing.

Click OK. The overlay will load in OBS and stay in sync with your dashboard settings in real time.

What's Next?

• Connect your streaming platform to enable chat commands and events.
• Configure TTS so viewers can speak on stream.
• Set up Alerts for follows, subs, and raids.