Skip to main content
generator·Updated 2026-11-07

Free OBS Overlays Generator New

Fifteen browser-source overlays for Twitch, Kick and YouTube streams: starting soon, be right back and ending scenes, countdowns, a live clock, lower thirds, social handles, a scrolling ticker, goal bars, top lists, counters, polls, a webcam frame and live Twitch chat. Transparent background, any size, no account.

No sign-up · Transparent background · Settings live in the link · Live Twitch chat included

Build your overlay

Live preview of the exact page OBS will load.

Open

In OBS set Width 1920 and Height 1080. This timer starts when OBS loads the source. Tick “Refresh browser when scene becomes active” so it restarts every time you switch to the scene — or pick “Until a clock time”, which survives reloads.

Scene pack — same style for all three
  • Starting soon
  • Be right back
  • Stream ending

Texts come from the last settings of each scene — switch to it above to edit.

Starting soon — content
Style
Edit an overlay you already use
My overlays (saved in this browser)

Nothing saved yet — up to 20 overlays.

No sign-up required. Use the tool, share the result, leave — no account needed.
Client-side computation. Calculations run entirely in your browser; we never see your inputs.
Embed in OBS / Discord. Append ?embed=1 to the URL for a bare iframe-ready widget.
How to use this tool

4 steps · ~1 minute

Each step is a single action — no setup, no sign-up. Outputs are client-side; nothing is uploaded.

Step 01

Pick an overlay and style it

Choose one of the 15 overlay types, fill in your text, then pick a theme or your own colours, a font, text size and position. The preview is the real overlay page, scaled down.

Step 02

Copy the browser source URL

Press Copy URL. Every setting is inside the link, so there is nothing to sign up for or save on our side.

Step 03

Add a Browser source in OBS

In the Sources dock click +, choose Browser, give it a name and confirm. Paste the link into URL and set Width and Height to the size shown under the preview, then press OK.

Step 04

Position it and go live

Drag or resize the source on the canvas. To change text later, edit it here and paste the new link into the source properties.

Adding the overlay in OBS, field by field

  1. Sources dock, + button, Browser. Name the source after the overlay (“Starting soon”, “Chat”) so you can find it later, then confirm.
  2. URL — paste the link from Copy URL. Leave Local file unticked.
  3. Width / Height — the size shown under the preview. Full-screen scenes and the positioned widgets are drawn for 1920×1080 and scale to any 16:9 size; the webcam frame should match your camera source; the chat overlay fills whatever size you give it, for example 420×720 in a corner.
  4. Custom CSS — leave the default. OBS’s default rule already makes the page background transparent.
  5. Shutdown source when not visible — leave it off for chat, so messages stay when you switch scenes.
  6. Refresh browser when scene becomes active — tick it on a “Starting soon” or “Be right back” scene whose timer counts N minutes, so the countdown restarts each time you switch to that scene.
  7. Press OK, then drag the source into place. To update text, open the source’s Properties and paste the new link.

What each overlay does

  • Starting soon, Be right back, Stream ending — full-screen scenes with a title, a subtitle, an optional timer (N minutes, until a clock time, or counting up how long you have been away) and up to eight social handles. “Scene pack” copies all three links in one matching style.
  • Countdown timer — a compact timer you can put anywhere on a scene, with a custom message when it reaches zero.
  • Live clock — the current time in any time zone, 12 or 24 hour, with seconds and the date if you want them. Handy when your viewers live in a different zone than you.
  • Lower third and Now playing — a name banner with a tag and second line that can slide in, stay for a set number of seconds and come back on a loop; and a small plate for the game, song or topic.
  • Social handles — up to eight handles shown one at a time on a rotation, or all together in a row or column.
  • Text ticker — up to ten messages scrolling along the top or bottom edge, with a separator, speed and an optional label block such as NEWS.
  • Goal bar, Top list, Poll results — numbers you type in: a progress bar with a currency prefix or unit, a ranked list with gold, silver and bronze places, and poll bars whose percentages always add up to exactly 100.
  • Counter — deaths, wins or anything else, clicked up and down through OBS’s Interact window.
  • Webcam frame — a gradient border with rounded corners, an optional glow and a name tag; the middle stays transparent.
  • Twitch chat — live chat with emotes, badges and name colours, message fade-out, hidden !commands and bots, and sub and gift notices. Messages deleted by moderators disappear from the overlay too. There is a separate page for it: the free Twitch chat overlay.

Design choices that matter on stream

Nine themes — including Twitch purple, Kick green and YouTube red — apply to every overlay type, so a scene full of widgets looks like one set; any of the four colours can be replaced with your own. Fonts are either the viewer-safe system fonts or fonts served from this site, so nothing is loaded from Google. Text size, corner radius, panel opacity and the distance from the edge are adjustable, all sizes scale with the source, and animations switch off when the system asks for reduced motion.

More free tools for your setup: pick an encoder bitrate with the OBS bitrate calculator, publish your week with the stream schedule generator, design your profile with free Twitch panels, or track a follower goal automatically with the sub goal thermometer.

FAQ · methodology & caveats

Frequently asked.

Calculator outputs are estimates. Each Q below names the source data and the assumptions baked in.

How do I add one of these overlays to OBS?
Build the overlay on this page and press Copy URL. In OBS, click the + button at the bottom of the Sources dock, pick Browser, name the source and confirm. Paste the link into the URL field, set Width and Height to the size shown under the preview (1920 by 1080 for most overlays) and press OK. You can then drag and resize it on the canvas like any other source.
Is the background really transparent?
Yes. Every overlay page draws nothing outside its own panels, and the Custom CSS that OBS puts into a new Browser source already sets the page background to transparent. The full-screen scenes have their own background options: gradient, solid, dim or fully transparent.
Do the goal bar, top list and poll update by themselves?
No. They show the numbers you type here, so nothing is connected to Twitch, Kick or a donation service. When the numbers change, edit them on this page and paste the new link into the source. Bars animate to the new value when the source reloads. For a follower or viewer goal that updates on its own, use the sub goal thermometer.
Why does my countdown start again?
A “Count down N minutes” timer starts when OBS loads the source, so reloading the source restarts it. If you want a timer that survives reloads and scene switches, choose “Until a clock time” and enter the time on the clock of the computer running OBS, with an optional date. Without a date it counts to the next time the clock shows that time; for two hours after the target it shows the finished text instead of starting a new day-long countdown.
How does the Twitch chat overlay connect?
It joins your channel’s chat as an anonymous read-only guest over Twitch’s chat WebSocket, the same way a logged-out viewer reads chat. No login, no token and no permissions are involved, and it cannot post. Emotes come from Twitch’s emote image server using the emote IDs in each message; badges and name colours come from the message data.
Can I show Kick chat too?
Not in this version. The chat overlay reads Twitch chat only. Everything else on this page — scenes, timers, banners, goal bars and so on — works for any platform, and there is a Kick colour theme.
Where are my settings stored?
In the overlay link itself. There is no account: OBS sends the link, the page draws the overlay from it. The optional “My overlays” list is kept in your browser’s local storage, and you can export it to a JSON file to move it to another computer.
How do I click the counter while streaming?
Right-click the counter source in OBS and choose Interact. In that window a click adds one step, a right-click subtracts one, and the + and − keys do the same. The value is saved in the page’s local storage; in our test in a Chromium browser it survived a page refresh. We have not tested a full OBS restart, so note the number before you close OBS if it matters.

Done with the tool? Ship the channel.

Streamrise delivers real Twitch and Kick viewer floors — residential IPs, geo-targeted, with chat presence. Same engineering rigor you saw in the calculator, on the paid side. No password requested. Cancel anytime.