Help Center
Products

Adding the Output URL to OBS as Browser Source

Step-by-step OBS Studio setup: add your Output URL as a Browser Source at 1920x1080 with a transparent background.

TutorialBeginnerUpdated

To display your graphics in OBS Studio, add the Output URL as a Browser Source.

Steps

  1. In OBS, click + under Sources.
  2. Select Browser.
  3. Name it (for example, "Helmo Graphics").
  4. Paste your Output URL in the URL field.
  5. Set Width to 1920 and Height to 1080.
  6. Check "Shutdown source when not visible" (optional, saves resources).
  7. Click OK.

Important settings

  • Custom CSS: leave empty (Helmo handles all styling).
  • Refresh browser when scene becomes active: optional, but recommended.
  • Hardware Acceleration: keep enabled for best performance.

Transparent background

The output has a transparent background by default. In OBS, the Browser Source will show your overlays with transparency: everything behind the graphics will be visible.

Layer order

Place the Browser Source above your camera/video sources in the OBS source list so the overlays appear on top.

Tips

  • Create one Browser Source per graphic (not per overlay).
  • All subcompositions within a graphic share the same output URL.
  • If the graphic doesn't appear, make sure you've deployed it first.
More in Helmo Graphics

Getting started

Editor interface

Working with elements

Subcompositions and animations

Live data and styles

Output and deployment

Troubleshooting