How to Set Up OBS Overlays in 30 Seconds

A SportsHeroes overlay is a web page that draws your live score on a transparent background. Streaming software such as OBS Studio, Streamlabs, vMix and XSplit can show a web page as a layer on top of your camera, so adding a scoreboard takes one link and no downloads.

Before you start

• A tournament and match created in your SportsHeroes dashboard.
• OBS Studio (or vMix, Streamlabs or XSplit) with your camera scene ready.
• An internet connection on the streaming computer, so the overlay can receive live scores.

Add the overlay to OBS Studio

1. In your match dashboard, open "Overlay Links" and copy the link for the overlay you want, for example the ticker or the scorecard.
2. In OBS, under Sources, click + and choose Browser.
3. Paste the link into the URL field.
4. Set Width to 1920 and Height to 1080, then click OK.
5. Keep the overlay source above your camera in the source list so it draws on top.

Score a ball from your phone and watch the overlay update. You do not need to touch OBS again for the rest of the match: runs, wickets, overs and players change as you score.

Using vMix instead

In vMix, add a Web Browser input, paste the same overlay link and set the size to 1920 × 1080. Place it as an overlay on top of your camera input.

If the overlay does not update

1. Check the internet connection on the streaming computer.
2. Refresh the browser source: right-click it in OBS and choose Refresh.
3. In the source's Properties, tick "Refresh browser when scene becomes active".
4. Still stuck? Email support@sportsheroes.in with a screenshot.