What is OBS Browser Source Overlay? [Complete Guide]

An OBS browser source overlay is a web page embedded as a layer in OBS Studio that appears on top of your stream. It uses OBS's built-in Chromium browser to render any HTML/CSS/JavaScript URL as a stream element. Browser source overlays are the standard method for integrating third-party tools into OBS.

What Is a Browser Source Overlay?

OBS Studio includes a "Browser" source type that loads any web URL as a layer in your scene. The page renders live inside OBS using an embedded Chromium browser, supporting full HTML, CSS, JavaScript, WebSockets, and animations.

How to Add a Browser Source

  1. In OBS, click + under Sources → Browser
  2. Paste the overlay URL
  3. Set width and height
  4. Click OK — the overlay appears on your scene

Why Browser Sources Are Popular

No plugin install, no OBS version conflicts, works on every OBS version since 2019, under 1% CPU overhead. This is why StreamTranslate uses a browser source instead of a plugin.

Start Translating Free →