Topics ▾

Topic hub

Twitch Chat Overlays

Render chat as transparent video, with 7TV, BTTV, and FFZ emotes.

A Twitch chat overlay is the visible scroll of chat messages composited on top of gameplay footage. It’s the single most recognizable visual element of Twitch content — when you see a clip with chat reactions running down the side, you know exactly what platform it came from. Done well, the chat is the joke. Done badly, it’s an unreadable wall.

There are two completely different ways to deliver one, and the right tool depends on which one you need.

Live overlay vs. post-rendered overlay

A live chat overlay runs inside OBS as a browser source while you’re streaming. The chat updates in real time, viewers on your stream see it embedded in the video, and it’s gone the moment the stream ends. Tools like ChatIS, KapChat (built into Restream), and Chatterino-OBS handle this. Setup is a URL pasted into a browser source plus some CSS for styling.

A post-rendered chat overlay is a separate video file — usually a transparent MOV with an alpha channel, occasionally a green-screen MP4 — generated from the chat log of an already-finished VOD. You drop it onto a track above your gameplay footage in Premiere or DaVinci Resolve, and the chat scrolls in sync with the original timestamps. This is the workflow used for YouTube uploads, highlight clips, and montages.

Most editors need the second one. The live overlay is for streamers; the rendered overlay is for everyone editing after the fact.

Third-party emote support is the whole game

Twitch’s native emote set is small. The actual emote vocabulary your chat uses comes from three third-party extensions:

  • BTTV (BetterTTV) — the original third-party emote service, mostly static PNG and animated GIF emotes
  • FFZ (FrankerFaceZ) — overlapping catalog with BTTV, popular for moderation features
  • 7TV — the newest and now dominant service, notable for animated 7TV emotes that play smoothly at high frame rates

If your chat overlay tool doesn’t render BTTV, FFZ, and 7TV, the chat in your final video won’t match what viewers actually saw on stream — it’ll just be a sea of question marks and unrendered emote codes. Animated 7TV support is the current dividing line between modern overlay tools and legacy ones. The big animated emotes (catJAM, peepoLeave, Pog variants) are how chat actually reacts now.

The transparent video workflow

For post-production, the standard delivery format is a MOV file with an alpha channel (usually ProRes 4444 or PNG codec). Alpha means transparent background, so when you stack it above your gameplay footage in your NLE, only the chat messages show through.

The alternative is a green-screen MP4 — the chat is rendered against a chroma-key green background, and you key it out in your editor. This is older, lossier (compression artifacts around emote edges), and mostly used when alpha-channel rendering isn’t available. Use MOV with alpha when you can. Use green screen only as a fallback.

The main tools

TwitchDownloaderCLI is the open-source standard. It’s a command-line tool that downloads VODs, downloads chat logs as JSON, and renders chat to video — including BTTV, FFZ, and 7TV emotes. The render command takes the JSON chat log plus a font, background color (or transparent), and dimensions, and outputs your overlay file. It’s free, scriptable, and what most editor pipelines are built on. The tradeoff: it’s a CLI, the rendering step can take 20-40 minutes for a long VOD, and you need ffmpeg installed.

Chatterino with the OBS browser source plugin handles live overlays cleanly. It’s the standard live solution for streamers who want a customizable chat box that doesn’t depend on a hosted service URL.

ChatIS is a hosted live overlay you embed via URL — easier setup than Chatterino, less customizable.

vod.ing is the no-CLI path for post-rendered overlays. You give it a Twitch VOD URL, it pulls the chat (with full BTTV/FFZ/7TV including animated emotes) and renders the overlay video without any local download or command-line work.

Picking the right one

If you’re streaming and want chat visible on the broadcast itself, use a live overlay (Chatterino-OBS or ChatIS). If you’re editing a VOD after the fact and you’re comfortable on the command line, TwitchDownloaderCLI is free and produces clean output. If you’re editing VODs and don’t want to manage a CLI, ffmpeg, and 30-minute render queues, a hosted renderer is the obvious tradeoff.

The technical floor for any of these: BTTV, FFZ, and animated 7TV must render correctly. If they don’t, the overlay isn’t actually showing what your chat did — it’s showing a censored version. That defeats the point.

All guides in this topic