An overlay is visual content placed above a stream scene. A simple name, schedule or social-handle strip can help viewers identify a channel without covering the main content. TooliFyra’s generator creates a text-based HTML overlay; it does not automatically design a complete stream package, webcam frame or third-party alert system.

Create an overlay with TooliFyra

  1. Open the OBS Overlay Generator.
  2. Enter the text you want to display and choose colors, font options or animation settings available in the form.
  3. Generate the preview and check that the text is legible against the intended background.
  4. Download the HTML file and keep it in a folder you can find again.

Add the HTML file as an OBS Browser Source

  1. In OBS, select the scene where the overlay should appear.
  2. In the Sources panel, choose + and add a Browser source.
  3. Enable Local file and select the downloaded HTML file.
  4. Set the browser-source width and height to match the canvas or overlay area, then position the source in the scene.
  5. Preview the scene at stream size and make sure text does not cover game controls, captions or other important content.

OBS documents the Browser Source’s local-file option and other settings. If you want live follower or donation alerts, OBS generally displays alerts from a third-party provider in a browser source; this generator itself does not connect to those services.

Keep the layout readable

  • Use short labels and a font size that remains readable on a phone-sized preview.
  • Keep the center of the scene open for gameplay, slides or the camera.
  • Check the overlay against both dark and bright scenes.
  • Use a separate OBS source for images or a webcam frame if you need them.

Frequently asked questions

Does this generator create alerts?

No. It creates a text-focused HTML overlay. Alerts require a separate provider or source and must be added to OBS separately.

Can I use the overlay without an internet connection?

A downloaded HTML file can be loaded as a local Browser Source, but any external fonts or assets you add may still require a connection.

What size should the Browser Source use?

Match it to your OBS canvas or to the portion of the canvas the overlay needs. Preview the scene after changing dimensions.