Skip to content
TipPage Docs
Esc
↑↓navigate↵open⌘Jpreview
On this page

Add your overlay to OBS

One browser source, two settings, done.

Your overlay goes into OBS as a single browser source. The steps below are for OBS Studio; Streamlabs Desktop is the same idea.

Add a Browser Source

In OBS, click + in the Sources panel, pick Browser, and name it something like “TipPage overlay”.

Paste your overlay URL

Copy the URL from the dashboard’s Overlay page (gear menu, Copy URL) and paste it into the URL field.

Match the overlay's resolution

Set Width and Height to the resolution shown on the overlay’s row in the dashboard - 1920 x 1080 unless you picked something else when creating it. The overlay always renders at exactly its own resolution (that’s what keeps the layout identical on every screen), so a mismatched browser source will crop or letterbox it. If the two don’t match, the overlay says so inside the browser source and tells you which Width and Height to type; the notice goes away as soon as they do. OBS scales the source with your scene from there.

Back in the dashboard, the overlay’s row should now show a green connected chip. Fire a test alert to prove the whole chain works.

While you’re in OBS: the dock puts the queues and their controls in a panel beside your scenes.

Troubleshooting

  • “This overlay is already open on another device” - the same URL is loaded somewhere else (another OBS profile, a stray browser tab). Close the other one; it retries automatically every 10 seconds.
  • “Another overlay is already connected with an exclusive widget” - two of your overlays both have a tip alert or media player, and both are connected. Keep one of them, or move the widget.
  • “This overlay isn’t set to the correct resolution” - the browser source’s Width and Height don’t match the overlay’s own resolution, so it is being cropped or letterboxed. Double-click the source and set them to the numbers in the notice.
  • “This overlay key has been rotated” - the key was rotated in the dashboard. Copy the new URL and update the browser source.
  • No sound - the overlay plays through your desktop audio. Check the browser source isn’t muted in OBS, your desktop audio device is the one you’re listening on, and the overlay’s volume sliders in the dashboard aren’t at zero.
  • Changes in the dashboard not showing - the overlay reloads itself when you save settings; if it looks stuck, right-click the source in OBS and hit Refresh.

Was this page helpful?