Using your lower third
- OBS Studio, animated: click Copy OBS link, add a Browser source, paste the link and set it to 1920 × 1080. The background is transparent. Tick Shutdown source when not visible so the strap slides in each time you show the source.
- OBS Studio, still: add an Image source, choose the PNG and keep it full-frame (1920 × 1080). Add a Move or Fade transition to animate it in.
- Offline: Download HTML gives you a single file that works without an internet connection. In OBS, tick Local file in the Browser source and pick it.
- vMix: load the PNG as an input and assign it to an overlay channel (1–4). Use the overlay transition for a wipe.
- Premiere, Resolve, Final Cut: drop the PNG on the track above your interview and keep it up for roughly 4–6 seconds, enough to read twice.
Good lower-third practice
- Keep names under ~25 characters and titles under ~45. Shorten the title, never the name.
- Use at least 4.5:1 contrast between text and strap.
- Do not stack more than two lines; viewers read lower thirds in a second or two.
- Check placement against your framing with the safe-area checker.
Add a scrolling headline bar underneath with the news ticker generator.
FAQ
Is the OBS link private?
The link contains your text and colours as URL parameters and nothing else. The overlay page renders it locally in OBS; we do not store anything on a server.
Why does the animation not replay when I switch scenes?
Tick "Shutdown source when not visible" and "Refresh browser when scene becomes active" in the Browser source properties. OBS then restarts the page each time.
Can I use my own font?
The generator offers fonts that are installed on most computers. If you download the HTML file you can edit the font-family line to any font installed on the streaming PC.
What resolution should I use?
Set the Browser source to the same size as your OBS canvas, usually 1920 × 1080. The overlay scales with the source size, so a 3840 × 2160 canvas also works.