How to Add a Scoreboard Overlay in OBS: Step-by-Step Guide
A complete walkthrough for adding a live, real-time scoreboard overlay to your OBS stream using ScoreLayer's browser source.
If you've ever tried to add a live scoreboard to an OBS stream manually, you know how painful it gets — custom graphics, manual updates mid-game, and a score that's always one step behind the action. ScoreLayer eliminates all of that.
Here's exactly how to set it up in under five minutes.
What you'll need
- An OBS install (or vMix — the steps are nearly identical)
- A free ScoreLayer account
- A scoreboard created for your sport
Step 1: Create your scoreboard
Log in to ScoreLayer and hit Create scoreboard. Pick your sport, choose an overlay style, and optionally set your team names and colours. You can always change these during the game.
Once saved, you'll land on the control panel for that scoreboard.
Step 2: Copy the overlay URL
In the control panel, click Copy overlay link. This gives you a URL that looks something like:
https://scorelayer.live/scoreboards?token=xxxxxxxxxxxxxx
This URL renders the scoreboard as a transparent overlay — perfect for OBS's browser source.
Step 3: Add a browser source in OBS
- In OBS, click + under the Sources panel and select Browser.
- Name it something like
Scoreboard Overlay. - Paste the overlay URL.
- Set width and height to match your canvas — typically 1920 × 1080 for 1080p.
- Check Shutdown source when not visible to avoid unnecessary background updates.
- Click OK.
You should see the scoreboard appear immediately on your canvas.
Step 4: Position it
Drag the browser source to the bottom of your canvas — most sports scorebugs sit at the bottom-left or span the full bottom bar. Resize if needed.
Step 5: Control the score from your phone
Open the control panel URL (shown in your ScoreLayer dashboard) on your phone or a second screen. You can now update scores, start and stop the clock, and change periods in real time. Every change appears on the overlay within a second.
That's it. No plugins, no WebSocket servers, no custom graphics software.
Tips for a clean broadcast
- Use a chroma key layer if your overlay style doesn't have full transparency (though all ScoreLayer styles render transparent by default).
- Lock the browser source in OBS once positioned to prevent accidental dragging during a game.
- Give a co-operator the control link — ScoreLayer supports multiple operators on the same scoreboard, so you can delegate score-keeping to someone on the bench.
Works in vMix too
vMix users: the setup is identical. Add a Web Browser input, paste the overlay URL, and size it to your output resolution. The overlay updates in real time just like in OBS.
Questions? Reach out via the support page.