How To Add An Overlay To OBS - Level Up Your Streams

Today, all you need to build a global streaming business is a live streaming platform. But, to reach more viewers, it is important to be able to stand out from the crowd. Whether you want to start a streaming service or live stream an event, customization and branding will help you get noticed.

How To Add Overlay To OBS

One of the ways to achieve this is with a stream overlay because it makes it easier for viewers to identify your brand and stream at a glance. Stream overlays also enhance the broadcast by displaying notifications and donation messages which are all integrated into the video stream.

You can easily add an overlay in OBS (Open Broadcaster Software) as we will show you in the below post.

What Is A Stream Overlay?

Much like OBS plugins, overlays are an extension of the default OBS functionality. A stream overlay is typically a graphic or piece of information that is visible to the viewer on top of the raw live video feed. Overlays are typically things like images, text, webcams, custom QR codes or interactive elements that are used to add more information and styling to your broadcast.

On websites such as Twitch, overlays can be used to display viewer donations as well as recent followers or subscribers. There is a good amount of Twitch overlay templates to help you add an extra layer of interactivity to your stream.

You are not limited to a single overlay. You can keep adding more layers until you have something that looks completely different from your competitors, which really helps you stand out. Below is an example of how Twitch’s own channel harnesses the power of interactive elements and custom OBS overlays to produce a very unique looking stream.

OBS Overlay

Image via Twitch’s official channel

Why Use A Stream Overlay?

We already covered some of the reasons to use live stream overlays. But there can be many more, depending on what you are looking to achieve. The most common example would be using a branded webcam overlay in your video stream so viewers can see you and your live reactions.

This is a great way to add more personality to your stream. Combined with custom designs and colors, it really helps you make your stream your own.

For businesses that regularly broadcast, adding the ability to brand your stream is important for when a viewer embeds and shares your content on social media. An overlay makes your brand visible even before someone presses play.

Here are the most common types of overlays that you can employ in your live streams.

Overlay Type

How to add

Difficulty

Interactive

Standard Image

Added via OBS locally

Beginner

No

Webcam Frame Overlay

Added via OBS locally

Beginner

No

Follower / Subscriber Alerts

Via Streamlabs OBS or third party

Intermediate

Yes

Donation Overlay

Via Streamlabs OBS or third party

Intermediate

Yes

Extension Overlay

Exclusive to Twitch - added from site

Intermediate

Yes

How to add overlay to OBS

Once you’ve set up OBS, adding a stream overlay is fairly easy. Just follow the below steps in our OBS studio overlay tutorial.

The video above explores how to add a webcam overlay with OBS but there are other possibilities, too.

Adding An Image Overlay With OBS

  1. Once you have loaded up OBS, you will see at the bottom of the screen the options for “scenes” on the left, and “sources” on the right. Select the scene that will contain your OBS stream overlay and click on the (+) icon shown below to bring up a list of options. This adds a new source.

    Stream Layout
  2. After clicking the (+) button to add source, you will be given a number of options. Simply click on “image” from the list.

    OBS Stream Overlay
  3. After clicking on “image”, you will be given a box that asks you to set a name for your image. Type a name and click on “OK”.

    Once you have done that, select “browse” from the window below to find and add your image.

    OBS Webcam Overlay
  4. After you have confirmed the selection, you will see your image on top of your video stream or preview window.

  5. You can click and drag on the red squares from overlay to resize the image. You can also click and hold anywhere inside the red square to drag the overlay around the preview window.

    OBS Borders

Websites that provide free and premium overlays

We aren’t all graphic designers, but, fortunately, there are both paid and free overlays available to download from various websites. These OBS overlays are suitable for just about any use case — from general webcam stream designs to custom alerts for your stream.

Premium overlays

Below are some of the premium OBS overlays that are reasonably priced. Here you will find a lot of professional-looking high-end stream overlay templates that are suitable for gamers, casual streamers, and businesses alike. These templates will be compatible with most of the streaming video providers that you will be looking to broadcast to.

  • Nerd or Die - Overlays and alerts focusing mainly on gamers and hobby streams. In addition to premium overlays, the site also offers customizable alert box widgets of OBS that help you attract donations and new subscribers.
  • Own3DTV - Offers premium overlays, alerts, and packages for gamers and casual streamers. There are many designs here suitable for a variety of different content types so it is definitely worth checking out.
  • Visuals by Impulse - Another website that provides premium overlays and also a selection of free downloads. Suitable for all types of creators and brands.

Free overlays

If you aren’t currently looking to spend money on overlay designs, you still have some great options available to you. If you want something fairly basic to get the ball rolling, these sites will provide you with a good selection of overlays and alert designs for your broadcast.

  • Zerging.net - A smaller, lesser-known website that provides a great bunch of options for those looking for free and basic overlays.
  • Twitch Overlay - Another website that offers overlay packs for both gamers and brands. Twitch Overlay is also a great option to check out for free Twitch alert designs.
  • Nerd or Die - As listed previously, Nerd or Die is a great site for premium overlays, but they also offer a free selection of tools which allow you to create some fantastic looking graphics and alerts.

How To Make Parts Of Your Overlay Visible Before Going Live

There is no doubt that OBS is powerful streaming software. As such it gives you a ton of options to customize your streams, including adding a “starting soon” screen. This is easy to achieve with the scenes and sources sections of OBS that we touched on earlier.

To add a “starting soon” screen, follow the steps that we listed previously to add an image. This time, make sure that you have added a scene for your “starting soon” image. In our example below, it is named “Intro Screen”.

Custom OBS Overlay

To show your intro screen before you go live, make sure the appropriate scene is selected and displayed in your preview window. When you want to start your main broadcast, you simply switch to your main screen capture scene via a hotkey.

You can bind a hotkey to your main “screen capture” scene by navigating to the following section of OBS.

File > Settings > Hotkeys. Scroll down until you reach the scene you want to assign a hotkey to, then you simply press the key that you want to use as a hotkey.

In our experience, these are the best OBS settings to enable a smooth and seamless transition from the “starting soon” screen to the main live stream.

FAQs

How to add interval screens to your stream

You can do this in exactly the same way that we added our intro screen and other images. Only this time, you will use it as an interval screen that you can switch to when needed. An interval screen can be made with a dedicated OBS scene. You just have to add your interval image in the same way we covered previously. You should also bind this to a hotkey to quickly switch to if you need to take a quick break.

How do I make my own stream overlay?

Making a stream overlay is quite simple if you are familiar with photo editing software such as Photoshop. There is a great in-depth guide here showing you how to create your overlay step by step.

In short, a good starting point would be to identify the different elements of your stream such as your OBS webcam overlay, the theme of the design, and which panels you will need for things like donations, subscribers, and followers.

You can create each section individually, and then add the images to OBS to see how they look in the preview window.

How do I add an overlay URL to OBS?

Adding widgets to OBS can be very useful for a number of reasons. The common reason for doing this is to get donation and follower notifications to appear as a layer on top of your stream as alerts.

Using Streamlabs as an example, here’s how to add an overlay URL:

  • Find your widget URL from the alert box menu via the Streamlabs website.
  • Next, follow the same process as when we added our image earlier, only this time instead of choosing “Image” we choose “Browser”.
  • Paste your widget URL from Streamlabs (or any other URL) into the window and click OK.
  • Resize and move the element in exactly the same way that we did when adding images in OBS.
  • You can align the widget within the OBS borders inside the preview window.

You can also add overlays to Streamlabs widgets and use the live studio to further customize the look and theme of your stream.

You can make sure that things are working correctly by running the tests available in the Streamlabs dashboard.

Conclusion

Adding OBS Studio stream overlays to your broadcast can greatly improve the appearance of your stream. Not only does this make your stream look more professional, but it can also ensure your broadcasts are consistent with your brand.

Using overlays, you can also add extra functionality such as follower and subscriber alerts which bring your community directly into your streams and content.

Further reading

If you would like to find out more about getting the most out of OBS, overlays, and extensions, check out some of the links below.

Did you know?

Broadcast Like A Pro & Monetize Your Streams

Try It Free
Twitter
Facebook
Linkedin

DON’T MISS OUT

Get updates on new articles, webinars and other opportunities:

Share this Post: