How to Add Discord StreamKit to OBS

The short answer

Discord StreamKit Overlay is a web-based widget from Discord that shows Discord activity, such as who is in a voice channel and who is speaking, on top of your stream. To add it to OBS Studio, connect StreamKit to your Discord desktop app, choose a widget, copy the address it generates, and paste that address into a Browser source in OBS.

One distinction changes what you should expect: StreamKit is a visual overlay only. It does not bring Discord voice audio into OBS, and it does not add your webcam. Discord audio needs its own audio capture in OBS, and your camera needs its own video capture device source.

Before you start

• OBS Studio installed and open on your computer.
• The Discord desktop app installed, running and signed in on the same computer as OBS. StreamKit talks to the local Discord app, so Discord open in a web browser is not a substitute.
• Access to the server and channel you want the overlay to show.

Interface labels on the StreamKit page and in OBS can change between versions. The steps below describe the general workflow; if a button name differs slightly, look for the closest equivalent.

Step-by-step: add the StreamKit overlay

• 1. Open the Discord StreamKit Overlay page in a web browser. You can find it by searching for "Discord StreamKit Overlay"; make sure the page is Discord's official one.
• 2. Click the option to install for OBS. Discord should show a prompt asking you to authorize StreamKit to connect to your account. Approve it.
• 3. Choose a widget. The voice widget shows members of a voice channel and highlights whoever is speaking; a text or chat widget shows messages from a text channel.
• 4. Select the server and the channel the widget should display.
• 5. Adjust the widget's display options on the StreamKit page if you want, and watch the preview update.
• 6. Copy the address the StreamKit page generates for your widget.
• 7. In OBS, select your scene, click the plus button under Sources, and choose Browser.
• 8. Give the source a recognizable name, such as Discord Voice, and confirm.
• 9. In the Browser source properties, paste the copied address into the URL field.
• 10. Set the width and height so the overlay fits where you want it on your canvas, then click OK.
• 11. Drag and resize the source in the OBS preview to position it.

How to know it worked

For the voice widget, join the voice channel you selected in Discord. Within a moment, your avatar and name should appear in the OBS preview. Speak, and your entry should show a speaking indicator. Ask someone else to join and talk to confirm that other members appear too. For a text widget, send a message in the chosen channel and check that it shows up in the preview.

This check confirms that the overlay is connected and updating. It does not confirm that viewers can hear Discord, that your microphone sounds clear, or that your webcam is being captured. Test those separately: watch the OBS audio mixer meters while others speak to confirm Discord audio is reaching OBS, then make a short test recording and play it back to judge whether speech is intelligible. No verified input-level targets were available for this setup, so rely on the playback check rather than a specific meter reading.

If the overlay is blank or not updating

• Confirm the Discord desktop app is open and signed in to the same account you authorized.
• For the voice widget, make sure you have actually joined the voice channel you selected.
• Check that the URL in the Browser source matches the address you copied, with nothing cut off.
• Open the Browser source properties and use the option to refresh the cache of the current page.
• If you changed servers or channels, generate and copy a new address from StreamKit and paste it into the source.
• If it still fails, repeat the install-for-OBS step and approve the authorization prompt again.

Getting Discord audio into OBS

Because StreamKit carries no sound, add Discord audio separately. OBS's desktop audio capture picks up everything your computer plays, including Discord. On Windows, recent OBS versions also offer an application audio capture source that can capture Discord on its own, which keeps game or music audio on separate controls. Whichever you use, confirm the meter moves in the audio mixer when someone speaks in the call.

What this guide could not verify

No confirmed evidence was available for recommended overlay dimensions, audio level targets, or the current exact wording of StreamKit's buttons and widget names. Size the overlay by eye in your OBS preview, and judge audio by test recordings rather than fixed numbers.