Free OBS Overlays for Twitch Streamers - Hype Meter, Top Chatters, Now Playing

Setup Guide

Step-by-step instructions for adding both overlays to OBS, configuring your channel name, and troubleshooting common issues.

How to set up the overlays

Covers everything from setting the channel name via URL param, correct OBS browser source dimensions, transparent background setup, and what to do if things aren't working.

User Commands

Every public chat command you can use at twitch.tv/ZeroOneBeats - info commands, voting, comments, and the !sr song-request system explained in full.

>_
How to use chat commands

Covers the general info commands, music interaction (!dope, !nope, !comment, !artist), and a full breakdown of how !sr works including the segment rule, cooldowns, and every reply the bot might give you.

Now-Playing Overlay

Three visual designs - pick a style, then copy the OBS URL for the position you want on your broadcast. Add it as a Browser Source in OBS.

Pick a design, then choose a position to copy the overlay link.
▸ Gradient bar with smooth text reveal
L/R: 800×100
C: 1000×60
Download Overlays

Standalone HTML files - add them to OBS as a Browser Source. No accounts, no subscriptions required. Set your channel name via ?channel=yourname in the OBS URL.

Hype Meter

Real-time chat activity meter. Connects directly to Twitch - no Streamer.bot needed. Measures messages per minute and fills a bar accordingly.

280 × 110 px No dependencies
↓   Download hype-meter-public.html
Chat Hype
SILENT
0 msgs / min
Top Chatters

Top 5 chatters leaderboard with animated rank-change transitions. Connects directly to Twitch - no Streamer.bot needed. Resets each stream.

430 × 330 px No dependencies
↓   Download top-chatters-public.html
Top Chatters This Stream