twitch alertsfollow alertobsstream alertstransparent webm

Twitch Follow Alert: Setup and Design Guide for OBS (2026)

October 20, 202613 min readAlertForge Editorial

A follow is the smallest thing a viewer can do for your channel, and on most channels it is also the event that happens most often. That makes the follow alert the piece of stream branding people see again and again. A good one reads in about a second, matches the rest of your overlay, and never covers the game.

This guide shows how to set up a Twitch follow alert three ways (Twitch's own Alerts, StreamElements, and Streamlabs), which OBS Browser Source settings matter, how to design the animation and sound, and how to fix the problems that come up most. Every setting and limit comes from official documentation, linked where used.

How a Twitch follow alert works

A follow alert is an on-screen notification that plays in your broadcast software when someone follows your channel. Twitch Creator Camp describes alerts as on-screen images that pop up during a stream to highlight community activity, and it names follower, subscriber, and cheering notifications as the most common kinds (Twitch Creator Camp: Twitch Alerts).

Three parts have to connect before anything shows on stream:

  1. The event. Twitch publishes a follow as a channel.follow event. Version 2 of that EventSub subscription requires the moderator:read:followers scope, which is why every alert service you connect asks for permission to read your followers (Twitch Developers: EventSub subscription types).
  2. The alert service. Something has to listen for the event and decide what to display: Twitch's built-in Alerts, or an alert box from StreamElements or Streamlabs.
  3. The browser source. The service gives you a URL. You add it to OBS as a Browser Source, and the alert renders over your scene when a follow arrives.

The animation file is only one link in that chain. When an alert never appears, the fault is usually the event connection or the browser source, not the artwork.

Comparison: Twitch's built-in Alerts vs StreamElements vs Streamlabs

All three can run a follow alert with custom media. The differences are where you edit, how much control you get over variants, and which file rules apply.

Twitch's built-in Alerts StreamElements Streamlabs
Where you edit Creator Dashboard, Alerts page Overlays editor, AlertBox widget Dashboard, Alert Box under Streaming essentials
Follower name variable {username} {name} {name}
Image and video files .png, .jpg, .gif, .mp4, .webm Static image, GIF, or video .png, .gif, .jpg, .jpeg, .webp, .webm, .mp4
Duration control Seconds, maximum 99 Adjustable per alert Adjustable per alert
Into OBS Alert set browser source URL Overlay URL as a Browser Source Widget URL as a Browser Source, or the Alert Box source in Streamlabs Desktop

Twitch's Alerts are the simplest route if you only need Twitch events. Creator Camp notes that tips, donations, and merch sales originate outside Twitch, so those need a third-party service.

How to set up a Twitch follow alert with Twitch's built-in Alerts

Twitch's own Alerts need no extra account. The steps follow the official setup article (Twitch Help: Setting Up Twitch's Alerts).

  1. Create an alert set. Open the Alerts page in the Creator Dashboard and choose Create Alert Set. A set is the whole collection of alerts you want on your video feed, including follows, subs, and raids. You can keep separate sets for different games or holidays and toggle them on and off.
  2. Open the editor. Click Edit Alerts on the set. The left side lists every event you can build an alert for, including Follows.
  3. Pick or create a Follows variant. Start from a default variant or click New Variant. Twitch calls the Alert Condition the most important setting: it is the rule that decides when the variant plays.
  4. Customize it. The options are in the customization article (Twitch Help: Twitch's Alerts Customization). Set the Duration in seconds, up to 99. Under Layout, place the text relative to the image; the background defaults to white at opacity 0, so it stays transparent unless you raise it. Under Text & Speech, write the message with {username} so the follower's name appears. Under Visual & Sound, upload your image or video and a sound, or pick from the defaults.
  5. Copy the browser source URL from the bottom right of the editing view, or from the triple-dot menu on the alert set, and paste it into OBS as a Browser Source. Twitch asks you to match the browser source dimensions to the alerts editor so the alert looks identical on stream.
  6. Send a test. Use Send Test Alert. You only copy the URL once; later edits saved in the dashboard appear on stream automatically.
  7. Turn on Live Alerts Controls (optional). Every alert then gets an Activity Feed entry where you can skip it, replay it, enable or disable it, or use Do Not Disturb to stop all active and upcoming alerts.

Upload limits from the customization article: static images up to 25 MB, video up to 100 MB, audio up to 25 MB, and an asset library of 100 MB for non-Affiliates or 1 GB for Affiliates and Partners. If you want variety, build several Follows variants with the same condition and enable Randomize, with Chance tiers from Common to Ultra Rare.

Steps for StreamElements and Streamlabs follow alerts

Both services put the follow alert inside an alert box widget and hand you one URL for OBS.

StreamElements (StreamElements Support: Setting Up Twitch Alerts with StreamElements Overlays):

  1. Go to Streaming tools, then Overlays, click New Overlay, and rename it.
  2. Click Add widget, then Alerts, then AlertBox. This creates a basic alert box with default alerts.
  3. Click the cog icon next to the Follower event. Use Set Image for a static image or GIF, or Change Video for a video file. Click Upload sound, pick a file, and click Submit.
  4. Choose a layout (text over image, row, or column), edit the message, and keep {name}, which StreamElements says is the new follower's username. Change the duration to match your media. Text-to-speech, text settings, and animations sit in the same panel.
  5. Save the overlay and copy its URL into an OBS Browser Source.

Streamlabs (Streamlabs Support: Setting up Your Streamlabs Alerts):

  1. In the dashboard, find Streaming essentials on the left and click Alert Box.
  2. Click Twitch in the left panel and pick Follows. Turn on Live Preview to watch changes as you make them.
  3. Select a stock image or video or upload your own, pick a sound, and keep {name} in the message. Set how long the alert stays on screen, choose how it appears and disappears, and adjust the text size, colour, and style.
  4. In the general settings, set the Alert Delay; Streamlabs recommends 2 to 5 seconds. Alert Moderation lets you approve alerts before they appear, and the Profanity Filter blocks words you choose.
  5. Press Save Settings in the bottom right before leaving the menu.
  6. In Streamlabs Desktop, click the plus sign in Sources and pick Alert Box. In OBS, copy the Widget URL at the top of the page into a Browser Source. Test with Test Widgets or the dashboard's test dropdown.

Streamlabs lists .png, .gif, .jpg, .jpeg, .webp, .webm, and .mp4 for media and .mp3, .ogg, and .wav for audio. Neither service states a size limit in its setup article, so if an upload fails, try a smaller file first.

OBS Browser Source settings that matter for alerts

Whichever service you use, the alert reaches your stream through one OBS source. The OBS Knowledge Base lists the Browser Source settings and defaults (OBS Knowledge Base: Browser Source). These affect alerts:

  • Width and Height default to 800 by 600. Set them to the canvas your service expects. Twitch asks you to match its editor; for StreamElements and Streamlabs widgets on a 1080p canvas, 1920 by 1080 is the usual choice, and the AlertForge OBS setup guide uses the same figure.
  • Custom CSS is filled in by default, and that default makes the page background transparent, removes body margins, and hides scroll bars. Do not clear it. A white or black box behind an alert is almost always a missing Custom CSS block.
  • Shutdown source when not visible is off by default and unloads the page when hidden. Leave it off for an alert source used in several scenes, so the widget is not reloading when a follow lands. Refresh browser when scene becomes active is also off by default and reloads the page on every scene switch, which alerts rarely need.
  • Refresh cache of current page is a button. Use it when you have edited an alert in the dashboard and OBS still shows the old version.
  • Source order. Drag the browser source to the top of the Sources list so it draws above gameplay and camera.

One source that does not work for live follows is the Media Source. It plays a file; it does not listen to Twitch, and the AlertForge Twitch alerts page says the same in its FAQ. It is still useful for testing a clip or a manual hotkey alert; its defaults are Loop off and Restart playback when source becomes active on, and .webm is on its supported list (OBS Knowledge Base: Media Sources). The OBS alerts page covers when to use each source.

Designing a follow alert that reads in a second

Follows are frequent, so the goal is recognition, not spectacle. Save the long celebration for subs and raids.

Keep it short. AlertForge's render data puts the average alert clip at about 8 seconds, enough for an entrance, a hold, and an exit (stream alert statistics). Aim at the shorter end for follows, and set the widget duration to the clip length so the exit is not cut off.

Show the name and nothing else that needs reading. Use {username} on Twitch or {name} elsewhere. Creator Camp's advice is a font size that is easy to read but does not take over the screen. A fixed title such as NEW FOLLOWER with the name underneath in the accent colour works well.

Place it away from the action. Creator Camp says alerts should not take over the show and should avoid covering key elements of the content. Pick a corner clear of the game HUD, camera, and chat, and keep every alert in the same spot.

Match the sound to the frequency. A follow sound plays many times an hour on a busy stream. Creator Camp recommends checking volume levels and testing audio before going live. Keep the follow sound shorter and quieter than the sub sound, and check it against game and microphone audio in a recording.

Use real transparency. A transparent WebM carries an alpha channel, so the animation composites over your scene with soft edges. GIFs work in every widget too, but their transparency is hard-edged and the files tend to be larger. Keep the WebM in its original format; an MP4 conversion drops the alpha. The transparent WebM alerts guide explains the codec side, and the AI transparent video page shows what the exports look like.

Keep the alert in the family. The follow alert should share colours, type, and character with your other alerts and scenes. In AlertForge, you create a free Style Sheet when you sign up, choose the Twitch moments you want alerts for, see the credit cost before each generation, preview the result, and keep or redo it. Exports are transparent WebM files that you upload to the Follower event in StreamElements or Streamlabs, or to a Follows variant in Twitch's Alerts, which accepts .webm. You can also change the title text, such as NEW FOLLOWER, before generating. The how to make Twitch alerts article compares that route with template packs and commissions.

Checklist before you go live

  • Browser source URL pasted into OBS, with the source at the top of the Sources list.
  • Width and height match the editor or widget canvas.
  • Custom CSS still holds the default transparent-background rules.
  • Alert duration is at least as long as the clip and sound.
  • Alert set and Follows variant toggled on; Do Not Disturb off.
  • Streamlabs Alert Delay set within the recommended 2 to 5 seconds.
  • Test alert fired, recorded for a few seconds, and reviewed at full size.

Troubleshooting

Nothing appears on a test alert. Check that the browser source URL is the current one for the alert set or overlay, and that the source is visible and above other layers. On Twitch, confirm the set and the Follows variant are toggled on and Do Not Disturb is off. Then press Refresh cache of current page in the OBS source properties.

Test alerts work, real follows do not. Twitch delivers follows through channel.follow, and version 2 requires the moderator:read:followers scope. If the service lost that permission, tests still play but live follows never arrive. Reconnect your Twitch account in the service and accept the permission prompt.

A black or white box sits behind the animation. Either the OBS Custom CSS default was removed or the file has no alpha channel. Restore the default CSS first. If the file is an MP4, re-export as transparent WebM. On Twitch's Alerts, also check that the Layout background opacity is still 0.

The alert is cut off before it finishes. The widget duration is shorter than the clip. Raise the duration in the alert's settings; Twitch allows up to 99 seconds.

Alerts show up late. Streamlabs recommends an Alert Delay between 2 and 5 seconds; higher values lag. A Browser Source reloading because of Shutdown source when not visible can add a gap too.

The alert looks different in OBS than in the editor. Twitch's instruction is to match the browser source dimensions to the editor. For other widgets, check that the source size matches the widget canvas and that the source is not stretched in the preview.

FAQ

Do I need to be an Affiliate to use Twitch's built-in follow alert? No. The customization article gives non-Affiliates a 100 MB asset library, and one short WebM plus one sound fit well within that.

How long should a Twitch follow alert be? Short enough to read the name and get out of the way. AlertForge's render data averages about 8 seconds across all alert types, and follows can sit below that. Twitch's maximum of 99 seconds is far more than a follow needs.

Which file type should I upload? A transparent WebM. Twitch, StreamElements, and Streamlabs all accept .webm, and it keeps soft-edged transparency without a chroma key. Use a GIF only if you must, and never an MP4 for a transparent alert.

Can I run Twitch's Alerts and a StreamElements or Streamlabs alert box at the same time? You can add both browser sources to OBS, but if both have a follow alert enabled you get two alerts per follow. Turn the Follows variant off in one of them.

Sources

Share

AlertForge Editorial

The AlertForge team builds AI-powered stream alerts for Twitch, YouTube, and Kick — transparent WebM video that drops straight into OBS.

Ready to build?

Start your Stream Identity style sheet

Use signup credits for your first style sheet, review the visual direction, then use credits to generate the assets you choose.