How to add live chat to OBS (the free 2026 guide)

Step by step

1. Step 1

   Popout your live chat URL

   Go to your live stream on YouTube, Twitch, or Facebook. Open the chat menu (⋮) and pick Popout chat. Copy the URL from the popout window's address bar.

   Live chat⋮

   viewer_42: pog

   sakura_chan: hi ✿

   Popout chat ↗

   Hide chat

   Copy the URL

   youtube.com/live_chat?v=…
2. Step 2

   Add a Browser Source in OBS

   In OBS, click + under Sources → Browser. Paste the popout URL into the URL field. A safe starting size is 420×720 for a vertical rail, 900×260 for a horizontal ticker.

   OBS · Sources

   Game Capture

   Webcam

   + Browser Source

   Properties

   URL

   popout chat URL

   Width

   420

   Height

   720
3. Step 3

   Style it with Chatto (optional but the point)

   Open the Chatto Studio, pick a preset or type a vibe into AI Styling, then click Export → Copy CSS. Paste that into OBS's Custom CSS field on the same Browser Source. Click OK.

   Custom CSS

   Chatto → Export → Copy CSS

   .yt-live-chat-text-message, .chat-line__message {
     background: rgba(20,15,20,0.6);
     border: 1px solid #ff9ec7;
     border-radius: 14px;
     animation: fade-in .42s;
   }

Frequently asked