What Is an OBS Browser Source? A Streamer's Guide

If you've used OBS Studio for more than a week, you've probably heard the term "browser source." It sounds technical, but it's actually one of the most useful and flexible tools in a streamer's kit. Here's everything you need to know.

The Simple Explanation

A browser source is exactly what it sounds like: a web browser embedded directly into your OBS scene. Instead of adding an image or a video file, you add a URL — and OBS renders that web page as a layer in your stream.

That web page can be anything: a static graphic, an animated overlay, a live chat display, an alert widget, or — importantly — real-time subtitles from a service like StreamTranslate.

How Browser Sources Work in OBS

OBS has a built-in Chromium browser engine (the same one that powers Google Chrome). When you add a browser source, OBS opens the URL in that embedded browser and renders it as a transparent layer over your scene. The page can contain HTML, CSS, JavaScript, and even WebSockets — meaning it can display live, updating data in real time.

This is why browser sources are so powerful for dynamic content. Unlike a static image that never changes, a browser source can update itself continuously — which is exactly what you need for live subtitles or chat overlays.

How to Add a Browser Source in OBS

• Open OBS and select the scene you want to edit
• Click the "+" button in the Sources panel
• Select "Browser" from the list
• Give it a name and click OK
• Paste in your URL and set the width/height (1920x1080 is standard for full-screen overlays)
• Check "Shutdown source when not visible" to save resources when the source isn't active
• Click OK and position/resize the source in your scene as needed

Common Uses for Browser Sources

• Alert overlays — follower, sub, and donation alerts from services like Streamlabs or StreamElements
• Chat overlays — display recent chat messages on screen
• Now Playing widgets — show what song is currently playing from Spotify or Last.fm
• Goals and counters — subscriber goals, hype trains, donation trackers
• Live translated subtitles — real-time captions that translate your speech for international viewers
• Custom scene transitions — animated HTML/CSS transitions

Browser Sources vs. Other Source Types

OBS supports many source types: media files, images, window captures, game captures, and more. Browser sources are unique because they can pull live data from the internet and update without any intervention from the streamer. This makes them the go-to solution for any overlay that needs to be dynamic.

Performance Considerations

Browser sources run a full browser engine, which uses CPU and memory. If you're running many browser sources at once, you may notice performance impact. Best practices:

• Only enable browser sources in scenes where they're needed
• Use the "Shutdown source when not visible" option
• Avoid browser sources with heavy animations or video content if you're already CPU-limited

Browser Sources and Live Subtitles

The most exciting recent use case for browser sources is real-time stream translation. Services like StreamTranslate provide a URL that you drop into OBS as a browser source. It listens to your microphone, generates speech-to-text, translates it, and renders the subtitles directly on your stream — all through a single browser source with no other setup required.

For streamers trying to reach international audiences, this is a game-changer that requires no coding, no plugins, and no changes to your streaming workflow.