Twitch Chat Overlay

Customize your Twitch chat overlay to fit your stream perfectly – right in your browser.

Choose a style (e.g., Glass, Neon, or Cyberpunk) and customize it as desired: custom background and text colors, fonts, frames, and even glow. The configurator will generate a ready-made link for you, which you can then OBS Simply insert it as a browser source—no additional plugins required. You'll see changes immediately in the live preview.

The overlay supports Twitch and 7TV emotes (including paint styles), displays profile pictures and badges, highlights @mentions, and filters out known bots if desired. You can freely overwrite each preset – for example, Cyberpunk with black background, custom font and dashed pink border + glow.

Features

  • 🎨 Design styles + overrides: Glass, neon, cyberpunk, retro, etc. – background, colors, fonts & effects freely customizable.
  • 🖌️ Colors & Typography: Background (also transparent), text & name color, Google fonts, font size.
  • 🧱 Frame & Glow: Border color, width & style (solid/dashed/dotted/none) as well as configurable glow effect.
  • 📐 Layout: Alignment left/right, compact mode, border radius, profile picture on/off.
  • 💬 Emotes & Paints: Twitch, 7TV, FFZ & BTTV including animated names and @Mention highlight.
  • 👤 Badges & Avatars: Twitch profile pictures and badges are displayed automatically.
  • 🧹 Bot filter: Hide known bots + add your own list.
  • 🗑️ Moderation: Deleted/timed-out messages disappear automatically.
  • 👁️ Live preview & OBS link: Test the settings and copy the finished link directly.
Presets are applied 1:1. Custom values only take effect if you actively change them.
Only sent when you touch the color (preset-first). Only sent when you touch the color (preset-first).
„"Right" reflects the chat layout.
When active, the entire text is in bold, not just mentions.
Controls the outer box around all chat bubbles (background, border, highlight).
Without a selection, the colors defined on Twitch will appear.
By default, older messages are removed as soon as they no longer fit completely in the field of view. This option allows them to remain as a "running feed."
Leave blank or 0 = off. If set, messages fade smoothly after a certain time, regardless of the scrolling mode.
Compact look
"Small Mode" reduces typography and avatars. "Lean Layout" compresses bubbles, spacing, and effects—both can be combined.
Tip: car/empty = automatic, style-dependent values • 0 = remove completely.
How do compact mode, spacing, and paint animation work?
  • Small mode: Smaller font/avatars/line height.
  • Keep the layout slim: Minimizes bubble borders/glow/spacing.
  • pad / gap / padMsg: Number = fixed override; empty = automatic; 0 = remove.
  • Animating 7TV paints: Only moves static paints smoothly. GIFs/APNGs remain animated.

FAQ

A chat overlay is a browser source that you integrate into OBS or other streaming software. It displays your Twitch chat directly in the stream – with its own colors, fonts, and emotes.

The chat overlay supports Twitch emotes, 7TV emotes (including paint styles and gradients), FFZ, and BTTV. Animated emotes are also displayed correctly.

No. You can configure the overlay completely without registration or installation. The configurator runs directly in the browser and generates a ready-to-copy OBS link.

Currently, over 6 design presets are available: Glass, Neon, Cyberpunk, Retro, and more. Each preset can be completely customized – background color, font, frame, glow effect, and more.

Yes, the overlay has a built-in bot filter. Known bots like Nightbot, StreamElements Bot, etc., are automatically hidden. You can also manually exclude your own usernames.

Yes, the overlay automatically displays Twitch profile pictures and badges (subscriber, moderator, VIP, etc.) next to the chat messages.

Yes, the overlay works with any streaming software that supports browser sources – such as OBS Studio, Streamlabs and XSplit.

Create your account