How to add chat to OBS
How to add chat to OBS for viewers or just for yourself, plus layout choices, moderation choices, and common setup issues.
By Soulstack · Stream Production · 5 min read · Published , updated
In this guide
There are two common reasons to add Twitch chat to OBS: to display chat on screen for viewers (especially in IRL or face-cam streams), or to keep chat visible to yourself without alt-tabbing during gameplay.
The right approach depends on which of those you want. This article covers both.
What "chat in OBS" actually means
Decide whether chat belongs in the broadcast video or only in your own control workspace. An on-stream widget is a Browser source; a private-to-you panel is a dock or separate window. Do not add your moderation dashboard as a broadcast source.
Chat overlaid on the stream (for viewers)
If you want chat visible on the broadcast itself, you need a chat box widget URL from your streaming tool or overlay service:
- Navigate to the chat box or chat overlay widget in your streaming tool's dashboard.
- Configure the appearance (font, size, background opacity, message hide delay).
- Copy the widget URL.
- In OBS, right click in Sources, then Add, then Browser source.
- Paste the URL. Set width to 400 and height to 600, or whatever fits the corner of your stream.
- Review whether the widget should keep running while hidden. Do not enable shutdown by default for a widget that needs to stay connected.
Position the chat box where it does not block important game UI. Check the crop in the actual game and on a small screen.
A few configuration choices worth getting right:
- Background opacity. Slight transparency reads better than fully opaque or fully transparent. Aim for 60 to 80 percent.
- Font size. Try 18 to 24 px as a starting point, then check readability on a phone and against the actual game background. The displayed size depends on your source and output scaling.
- Message hide delay. Set messages to fade after 30 to 60 seconds so chat does not stack up on screen indefinitely.
Chat visible only to you (for the streamer)
If you want chat visible during the stream but not broadcast to viewers, you have three options.
Option 1: A second monitor with Twitch's web chat in a browser tab. Use the channel's popout chat if that suits your setup, and confirm you are signed into the intended account.
Option 2: A docked chat panel inside OBS itself. OBS supports custom browser docks. Find Custom Browser Docks in OBS's Docks menu; menu availability can vary by platform and build. Add a dock with the popout chat URL. The dock floats inside OBS, not on the stream.
Option 3: A purpose-built chat dock from a creator toolkit. Add it as a custom browser dock in OBS for a chat panel with live chat, channel events, quick actions and moderation tools alongside your stream.
A simple stream layout that works for both
Many streamers do both: a small chat box visible on the broadcast for viewers (especially the ones watching on TVs or in fullscreen), plus a separate chat client on a second monitor for themselves.
The on-stream chat box can be smaller and less feature-rich; the personal chat client can have full mod tools, timestamps, and the ability to ban or timeout users without clicking through Twitch's UI.
Moderation while streaming
If you handle moderation yourself during streams, having quick access to moderation tools is more valuable than having chat visible on screen. Choose a view that exposes the moderation actions your account is authorised to use. Their placement and availability vary by tool.
If you have moderators, you typically do not need chat visible on screen at all. The mod takes care of incidents; the streamer reads chat through the second-monitor chat tab.
Performance
The performance cost depends on the widget, not simply whether it is labelled chat or alerts. Its cost depends on the page, animation and rendered size; check OBS performance with it enabled. You can leave it visible across all scenes.
A few things that hurt performance:
- Multiple chat sources in the same scene
- Chat sources at much higher resolution than the displayed size (e.g. a 1920 by 1080 chat source displayed at 400 by 600)
- Heavy custom themes with animated backgrounds or live emote rendering
If OBS is slow, the chat source is unlikely to be the culprit, but it is worth checking.
What this is not for
If your only goal is to read chat between game moments, you do not need a chat box on the stream. A second monitor or a phone with the Twitch app open is faster and lighter.
Chat on screen is for the viewer, not for the streamer. Add it if the people watching benefit from seeing chat messages overlaid on the broadcast (talk shows, IRL streams, reaction content). Skip it if you only want chat visible to yourself.
What viewers actually want
An on-stream chat box repeats information some viewers already have beside the player. Use the space only when it adds context. The on-stream chat box is most valuable for clips and recordings, where the chat reactions become part of the clip itself.
A small chat box in a corner that captures funny chat reactions during memorable stream moments adds context to clips later. That is the strongest case for on-stream chat.
Common problems
A few issues come up when chat does not work the first time:
- The chat box is blank in OBS but works in a regular browser. Check the URL, login state, source visibility and the service's browser-source instructions. A normal browser and OBS can have different sessions; do not assume the cause is user-agent blocking.
- New messages do not appear. The widget connection has dropped. Refresh the browser source.
- Chat looks fine in OBS preview but cropped on the broadcast. The browser source resolution does not match. Check the page dimensions, source transform and any crop in OBS; a live webpage is not fixed by re-exporting an image.