◆   ◆   ◆

OBS Overlay Setup

How to add a live gamecast scoreboard to your stream using OBS Studio.

1. Get Your Overlay URL

Start a game in Straight Pool Deluxe and tap Gamecast to get your gamecast link. Replace /gamecast/ in the URL with /gamecast-overlay/:

https://straightpooldeluxe.com/gamecast/abc123/
↓
https://straightpooldeluxe.com/gamecast-overlay/abc123/

That's the URL you'll paste into OBS.

2. Add a Browser Source in OBS

  1. In OBS, click + in the Sources panel and choose Browser.
  2. Paste your overlay URL into the URL field.
  3. Set Width to match your canvas width (e.g. 1920 for 1080p, or 2496 if your canvas matches your background image).
  4. Set Height to your desired bar height — 150–200 is a good starting point.
  5. In the Custom CSS box, make sure this is present (OBS usually pre-fills it):
    body { background-color: rgba(0,0,0,0); margin: 0; overflow: hidden; }
  6. Click OK.
Important: The Browser source Properties width/height control how the page renders — font sizes scale with this. The Transform controls where OBS places it in the scene. Always set Properties width to match your canvas width for correct font scaling.

3. Position the Overlay

Right-click the Browser source → Transform → Edit Transform to control exactly where the bar sits.

LayoutPosition XPosition YSize WSize H
Full-width top 0 0 canvas width bar height
Full-width bottom 0 canvas height − bar height canvas width bar height
Corner (top-left) 0 0 desired width bar height
Corner (top-right) canvas width − desired width 0 desired width bar height
For a corner layout, also set Properties → Width to your desired corner width (e.g. 800). This keeps font sizes proportional to the narrower bar rather than the full canvas width.

4. Customize the Look

Add query parameters to your overlay URL to change the color scheme and transparency:

ParameterValuesDescription
theme dark (default), light Dark uses a near-black background with white text. Light uses an ivory/cream background with dark text — better over bright video feeds.
opacity 0.0 – 1.0 Controls the transparency of the bar background. 1.0 is fully opaque, 0.0 is fully transparent. Default is 0.82 (dark) or 0.90 (light).

Examples:

/gamecast-overlay/abc123/
/gamecast-overlay/abc123/?theme=light
/gamecast-overlay/abc123/?theme=dark&opacity=0.6
/gamecast-overlay/abc123/?theme=light&opacity=1.0

5. Tips

  • After changing the URL or pushing code updates, click Refresh in the browser source properties to reload.
  • The overlay connects to the live game via Server-Sent Events — no polling, no manual refresh needed during the game.
  • If the scorer cancels the gamecast, a "Gamecast cancelled" message will appear over the overlay.
  • Use Shutdown source when not visible in OBS if you want the connection to drop when the source is hidden.