Show Runner

Graphics & overlays

Broadcast graphics and overlays for live streams — a producer's guide

· 5 min read

What broadcast overlays are, why URL-based browser-source graphics beat baked-in titles, and how to run lower thirds, sponsor bugs, up-next and scoreboards live in OBS or vMix.

Graphics are what separate a stream that looks like a webcam call from one that looks like a broadcast. Lower thirds naming your guests, a sponsor bug in the corner, an "up next" teaser, a live scoreboard — they carry information and they signal production value. This guide explains how modern live-stream graphics work, why the browser-source approach has become the standard, and how to run overlays live.

If you're new to overlays, start here; the tool-specific walkthroughs for OBS and vMix go deeper on each.

What is a broadcast overlay?

An overlay is a graphic layered on top of your video — usually with a transparent background, so only the graphic itself shows over the live picture. Common types:

  • Lower thirds — a name/title strip, typically bottom-left, identifying who's on screen.
  • Sponsor bugs — a persistent logo, often top-corner, acknowledging a partner.
  • Up-next / coming-up — a teaser for what's coming, shown between segments.
  • Scoreboards and standings — live sports data: score, clock, league tables.
  • Tickers, quotes, polls and quizzes — audience-facing information and engagement.

The key word is layered: the graphic sits above the video and can appear, update and disappear independently, without touching the underlying feed.

LIVE10:24:31:12Jane DoePRESENTER
A lower third — a name strip — composited over the live video

Baked-in vs. URL-based overlays

There are two ways to get a graphic on screen, and the difference matters.

Baked-in graphics are rendered as image or video files and dropped onto the timeline. They're fine for fixed elements, but every change means re-exporting, and anything live — a score, a just-confirmed guest name — is impossible to keep current.

URL-based overlays are a web page loaded as a browser source. The graphic is a live web page with a transparent background; your streaming software renders it on top of the video. Because it's a live page, it can update in real time — change the name on the lower third and it changes on air, no re-export, no re-import.

A browser source is a feature in OBS, vMix and most streaming tools that renders a web page (by URL) as a video layer. Point it at an overlay URL and the page's transparent areas show the video beneath. It's the mechanism behind almost all modern live-stream graphics.

This is why URL-based overlays have become the standard for live production: one URL, live-updating, driven by an operator.

Running overlays live

A good overlay workflow gives you three things:

  1. A single URL per graphic you can paste into OBS or vMix once and forget.
  2. Live control — an operator can take a graphic on, update its content, and take it off, and the change appears instantly on the stream.
  3. Transparency — the overlay composites cleanly over the video with no background box.

The operator doesn't touch the streaming software mid-show; they drive the content of the overlays from a control surface, while OBS/vMix just render the URLs. That separation is what lets one person run graphics for a fast-moving live show.

Overlays in OBS and vMix

Both major tools handle URL-based overlays the same way in principle — add a browser source/input, paste the URL, size it to your canvas — with slightly different menus. See the step-by-steps:

And for the two graphics every sponsored show needs, see sponsor and up-next graphics for live streams. When a template isn't quite right and you need something bespoke, you can build a custom overlay with OMUL.

How Show Runner handles it

Show Runner lets you build broadcast overlays in the browser and drop a single, transparent, live-updating URL into OBS or vMix. You design the graphic — lower thirds, sponsor bugs, up-next, fixtures/results, standings, quizzes and polls — then an operator drives it live: take it on, edit the content, take it off, and it updates on the stream instantly. Overlays are organised into channels so a whole show's graphics run from one place.

FAQ

Do overlays work in both OBS and vMix?

Yes. Both support a browser source/input that renders a web page by URL with transparency, which is how URL-based overlays work. You add the source, paste the overlay URL, and size it to your canvas — the transparent areas show the video underneath.

Can I update an overlay while I'm live?

Yes — that's the main advantage of URL-based overlays over baked-in graphics. Because the overlay is a live web page, an operator can change its content (a name, a score, the up-next teaser) and it updates on the stream in real time without touching your streaming software.

Will the overlay have a background box over my video?

No. Overlays are rendered with a transparent background, so only the graphic itself shows over the live picture. The browser source composites it cleanly on top of the video.

Do I need a separate computer to run graphics?

Not necessarily. The overlay URLs render inside OBS/vMix on your streaming machine; the content is driven from a control surface that can run on any device, so a second operator can drive graphics from a laptop or tablet if you want.


Ready to put professional graphics on your stream? Start for free, or read the OBS and vMix walkthroughs.

← All guides