A tier list overlay OBS treats like any other source

By the TierContest team·Updated August 26, 2026

Two ways to get the game on stream

There are two routes, and both are one-click from your live console:

• Browser Source widgets — the modular route. Each part of the game is its own URL with a transparent background, so you compose your own layout: vote bars beside your camera, the timer in a corner, the tier board along the bottom.
• Window capture — the zero-layout route. The creator console has a stream-clean view (no buttons, no private info); capture that window and you're done.

Widgets look sharper and let gameplay stay visible; window capture is faster to set up on a chaotic stream day. Plenty of creators start with the capture and graduate to widgets after the first session.

The widget kit

• Current item — the item being ranked right now, with its image. The focal point of every round.
• Vote bars — live per-tier tallies that animate as chat votes. This is the widget that makes voting feel like a horse race.
• Round timer — the countdown until votes lock.
• Tier board — the tier list as you've filled it so far.
• Leaderboard — the viewers with the most correct predictions this session, by chat username.
• Full scene — everything composed into a single 16:9 overlay if you'd rather add one source than five.

Step by step (about 10 minutes)

1. Start a live session and open your console. Create your tier list on TierContest, enter your Twitch or Kick channel name, and start the session. Your creator console lists the overlay widgets with a copy button for each URL.
2. Add a Browser Source in OBS. In OBS, click + under Sources, choose "Browser", and paste a widget URL. Overlay backgrounds are transparent, so the widget floats over your gameplay or camera scene.
3. Pick your widgets. Add the widgets you want as separate sources: the current item card, live vote bars, round timer, the tier board, or the viewer leaderboard — or use the single full-scene overlay.
4. Position and size each widget. Drag each browser source where you want it in your scene. Widgets scale to their source box; you can also pin exact dimensions via width and height URL parameters.
5. Go live and run the first round. Votes typed in chat move the bars in real time, the timer counts the round down, and the leaderboard updates each time you place an item.

Layout tips that survive contact with chat

• Keep the vote bars near your camera — viewers look at your reaction while the tally moves, and that's the moment that clips well.
• Don't show every widget at once. Current item + vote bars + timer carries the round; bring the full tier board up between rounds when you recap.
• The leaderboard earns its screen space at the end of the session — the Session Champions moment is the natural finale.
• If OBS renders a stale widget after you restart a session, refresh the browser source (right-click → Refresh) rather than re-adding it.

Works with OBS, Streamlabs, and friends

Anything that supports browser sources works: OBS Studio, Streamlabs Desktop, and other OBS-family forks. The voting itself happens in your platform's chat — see the Twitch guide or the Kick guide — so the overlay never asks viewers to interact with it. It's pure display, which is exactly what an overlay should be. See what a full round looks like in the interactive demo.