Want to show your live chat comments directly on your stream? OBS Studio makes it easy, and you don't need to spend a dime. This guide walks you through the steps to create a free chat overlay using OBS Browser Source and popular chat tools.
What You'll Need
- OBS Studio (latest version)
- A streaming platform (Twitch, YouTube, etc.)
- A chat widget service (e.g., Streamlabs, StreamElements, or a custom HTML page)
Step 1: Get Your Chat Widget URL
Most streaming platforms provide a chat embed URL. For example:
- Twitch:
https://www.twitch.tv/embed/YOUR_CHANNEL_NAME/chat?parent=YOUR_DOMAIN - YouTube: use the "Live Chat" embed option from YouTube Studio.
Alternatively, use a free tool like Streamlabs or StreamElements to generate a customizable chat overlay URL.
Step 2: Add a Browser Source in OBS
- In OBS, click the + icon under Sources.
- Select Browser.
- Name your source (e.g., "Chat Overlay").
- Paste the chat widget URL into the URL field.
- Set Width and Height to match your stream resolution (e.g., 1920x1080).
- Click OK.
Step 3: Customize the Overlay
To remove the background and make chat text appear directly on your stream:
- Create a custom CSS snippet in the Browser Source properties. For example, to make the background transparent and style the text:
body { background-color: transparent; }
.chat-line { color: white; font-size: 18px; }
- You can also adjust the chat box position and size by cropping or resizing the source in OBS.
Step 4: Test and Go Live
Preview your stream to ensure the chat overlay appears correctly. Once satisfied, start your stream – your viewers' messages will now appear on screen in real time.
Tips for a Polished Look
- Use a semi-transparent background or a colored box behind the chat text for better readability.
- Filter out spam or commands using your chat tool's moderation settings.
- Experiment with different fonts and animations (e.g., fade-in) to match your stream's style.
That's it! With these free tools and OBS, you can engage your audience by showcasing their comments live. No paid plugins required.