OBS overlay#

While capystreama is open, an embedded web server serves your current list as an OBS browser source, with live updates — so your stream always shows the up-to-date list. There is nothing to switch on: the overlay starts with the app.

Adding it to OBS#

  1. Load a list. The app serves it on loopback at http://127.0.0.1:8420. If that port is already taken, it falls back to an OS-assigned free port on 127.0.0.1 — the address to use is shown in the Item List tab as OBS browser source: ….

  2. In OBS, add a Browser source.

  3. Set the URL to the overlay address (e.g. http://127.0.0.1:8420).

  4. Size the source to taste. Toggle items or edit counts in the app and the browser source updates on its own — the page holds a live connection to the app, so there is no manual refresh and no polling.

The overlay shows the same stacks-of-64 breakdown as the app, so on-stream counts always agree with what you see in the Item List. The Title field at the top of the Item List tab becomes the overlay’s heading.

Sizing the text#

The Text size slider in the Item List tab scales the overlay’s item text, from 0% to 250% of normal (100% is normal, 200% is double). It changes the overlay only — the app’s own list is unaffected — and the setting is remembered between launches, so a size that suits your layout stays put.

Size the OBS browser source to the space you have, then use the slider to make the text readable inside it.

Customizing the look#

The overlay’s appearance is fixed: its markup and stylesheet ship inside the app and are not editable. Text size is the one thing you can change, with the slider above.