Discord Reactive Images lets you use a speaking and a non-speaking avatar image that switch with voice activity in a Discord channel. It is a third-party workflow linked from FugiTech’s site, not a built-in Discord avatar feature.
The basic setup is to prepare two matching images, authorise the service with Discord, join the intended voice channel, then add the generated Individual Browser Source link to a scene in OBS or Streamlabs Desktop. Test the switch before streaming; the image appearing in the service is not, by itself, proof that your scene is configured correctly.
Prepare two matching avatar images
Start with a quiet or non-speaking image and a speaking image of the same character. The simple workflow described in Streamlabs’ Reactive Images guide uses two PNG images. The speaking image can have an open mouth or another visible change that reads clearly at the size you plan to show it. You do not need to buy a microphone or a drawing tablet just to try the setup; use an existing mic and artwork if you have them.
Make the two files match in canvas dimensions, crop, and character position. If the idle file leaves more empty space on one side than the speaking file, switching can make the character seem to jump even though both images are technically working. Transparent backgrounds are useful when you want the avatar to sit over a game, call layout, or other scene element without a rectangular backdrop. Check the edges against both light and dark backgrounds if you expect to use either.
You can draw the images yourself, adapt artwork you already have permission to use, or commission an artist if you do not have suitable character art. A commission is optional: the setup depends on the two image states, not on a particular art style. Before using an image in a public stream, make sure you have the rights needed for that use.
Keep the files easy to identify, for example avatar-idle.png and avatar-speaking.png. Open both on your computer and compare their dimensions and framing before uploading. This small check makes it easier to distinguish a poor image match from a problem with Discord or the browser source later.
Open Reactive Images and authorise Discord
Go to FugiTech’s site and follow its link to Discord Reactive Images. The service uses a Discord authorisation flow as part of the setup described by Streamlabs. When Discord presents an authorisation request, read the permissions shown there before you approve it. The current details of the request should be judged from Discord’s own screen, not assumed from an older tutorial.
This is a third-party connection. Discord does not provide this particular Reactive Images workflow as a built-in avatar setting. Keep that distinction in mind if you are looking for a profile-picture change: the workflow here creates an image output for streaming software, rather than replacing your Discord account avatar.
Use the Discord account you intend to use in the voice channel and stream. If you have multiple accounts open in a browser, confirm which one Discord is presenting before authorising. A mismatch between the account authorised in the service and the account connected to the call can make troubleshooting confusing, especially if you are testing with a friend or moderator in the channel.
Do not assume that an authorisation screen will always look identical to one shown in a video guide. Interfaces change, and the permission prompt is the place to assess the current request. If it does not look right to you, pause rather than approving it simply to get to the next step.
Upload both images and keep the source link private
Follow the service’s current upload controls to assign the quiet image and the speaking image. Check that each file is in the intended state slot; a reversed assignment can make the avatar look as if it is reacting backwards. After configuring the images, obtain the Individual Browser Source link described in the Streamlabs guide.
Treat that generated URL like a private scene credential. Avoid showing it in a public screenshot, stream recording, or tutorial, and take care before sharing a scene export that might contain it. The source link is needed by your streaming software, but viewers do not need to see it. The current app’s reset or revocation controls have not been independently confirmed here, so do not rely on an assumed process for replacing a link if it is exposed.
Before moving on, note where you saved or copied the complete link. A missing character, an accidental space, or a truncated paste can produce a blank source later. If you paste it into a note temporarily, keep that note private and remove it when it is no longer useful. The point is not to make the workflow complicated; it is to avoid putting a private output URL in a place that will be broadcast or shared.
Join the intended Discord voice channel
Connect to the voice channel you plan to use during the stream. The setup instructions describe being connected to a Discord voice channel as part of the workflow; uploading the art alone is not enough to establish the intended voice context. If you usually stream in a private creator channel, test in that channel rather than a different one where your account or microphone settings may differ.
Check that Discord is using the microphone you expect. If you have a headset and a webcam microphone connected, the selected input matters: speaking into one while Discord listens to the other will not create the result you expect. Also look at the mute state. A hardware mute switch, Discord mute button, or a push-to-talk setting can all prevent your voice from registering in the way you intend.
If someone else is helping with the test, agree which account and voice channel each person will use. The goal is to test your own speaking image against the microphone input associated with your account, not merely to confirm that another participant is making sound. Once the right channel and input are established, leave Discord connected while you configure and test the scene.
Add the Individual Browser Source to your scene
In OBS or Streamlabs Desktop, open the scene where the avatar should appear and add a Browser Source. Paste the complete Individual Browser Source link into that source’s URL field. The names and placement of controls can differ between software versions, but the important distinction is to add the service output as a browser source, not as an ordinary image file or a Discord window capture.
Size and position the source in the scene. If the browser output has transparent areas, arrange it over your background or other scene elements as needed. Check the full preview at the size viewers will see; an avatar that appears large in a source settings panel may be too small once it is positioned beside a game or call layout. Make a short test recording or use the software preview before you rely on it in a live broadcast.
If the source appears blank, verify the URL from the beginning to the end, then refresh the browser source. Avoid copying the link from a screenshot or a formatted note where punctuation may have been changed. You can also check that the service is still open in the expected browser session and that the connected Discord account is the one you meant to use.
If your project is a continuous YouTube channel rather than a conventional creator stream, consider how the avatar fits the scene and schedule. For a scene with recorded content, the principles in this guide to adding a folder of videos to OBS for continuous playback can help you think through how separate scene elements coexist. For the broadcast itself, the YouTube Live Control Room workflow is a separate part of preparing and monitoring a channel; Reactive Images only addresses the avatar output.
Test voice activity and image switching
With the scene selected and Discord connected, speak into the microphone Discord is set to use. Confirm that the speaking image appears in the streaming software preview. Stop speaking and wait for the quiet image to return. The relevant test is whether both states switch as expected in the scene, not merely whether you can see both uploaded files in a service page.
Run a few ordinary tests at the volume and speaking distance you expect to use. A whisper or a clipped first syllable may not behave like steady speech, so use a normal sentence and pause. Check that the switch is visible at your intended on-screen size and that the character does not shift because the image dimensions or placement differ. If the image change is too subtle, revise the artwork rather than assuming the browser source has failed.
If nothing changes, work through the causes in a sensible order: confirm you are in the intended Discord voice channel; confirm the right account is connected; check Discord’s selected microphone and mute state; then verify the complete source URL and refresh the browser source. Change one thing at a time and retest, so you can tell what resolved the issue. If the scene is blank, focus first on the link and browser source; if the scene shows one state but does not react, focus on voice input and channel context.
When the avatar behaves correctly, make a short recording and play it back. This catches issues that a live preview can hide, such as the avatar being obscured by another source or positioned outside the final crop. If you also want to assess whether a broadcast itself is reaching viewers, keep that separate from avatar testing; a YouTube stream health warning is not always the same as an actual playback problem.
After a stream or test, disconnect from the voice channel if you no longer need to be in it. That avoids leaving your account connected in a call by accident. If you plan to use the avatar again, keep the scene and private source link where you can find them, but do not make the URL visible in a public scene collection or tutorial.
When a local PNGTuber app may suit you better
Reactive Images is a direct fit when your avatar should follow a Discord voice-channel workflow and you want its output in OBS or Streamlabs as a Browser Source. If you instead want more control over image states or want an avatar listening to a local microphone without depending on the same Discord context, a local app may be a better fit. The veadotube Mini documentation describes a different workflow with mouth states, optional blinking, and audio input controls; those are veadotube features, not claims about Reactive Images.
That choice has a practical trade-off. A local app means you manage another application and its capture method, while the Reactive Images setup centres on the browser output and Discord connection. veadotube’s guide for using the app with OBS gives platform-specific capture approaches. Choose based on whether you value a straightforward Discord-linked setup or more local control over avatar behaviour.
For either approach, test with the actual scene and microphone you intend to use. Do not assume that a workflow shown for one operating system or software version will match yours exactly. A small rehearsal is a better check than discovering an incorrect capture method, source position, or microphone input after you have started a public stream.
A practical pre-stream check
Before going live, make sure the quiet and speaking files are the right way round, share a consistent canvas and placement, and remain legible at the final scene size. Confirm that the correct Discord account is authorised, that it is in the intended voice channel, and that its microphone is not muted. Then check the Individual Browser Source URL, preview the scene, and record a short test if you can.
If you are using a scene that will be reused, revisit this check after you edit the avatar, replace a source, change accounts, or move to a different microphone. Those changes affect different parts of the chain, so a previous successful test does not confirm a modified setup. For ongoing channel operation, keep avatar checks distinct from broadcast checks: a working character does not prove that the stream is reaching YouTube correctly, and a healthy broadcast does not prove that voice activity is switching the image.
Before committing, compare the operating options on the pricing page. When the file and channel are ready, start free — 24-hour trial, no card.
FAQ
Is Discord Reactive Images built into Discord?
No. It is a third-party workflow linked from FugiTech’s site, and the cited setup guide describes connecting it to Discord and adding its output to streaming software. It does not replace your Discord profile avatar.
Why is my avatar blank in OBS or Streamlabs?
Check that you pasted the full Individual Browser Source URL into a Browser Source, then refresh that source. Also confirm the account and voice-channel context are the ones you intended; a blank output can have more than one cause.
Why does the speaking image not appear?
Check Discord’s selected microphone, mute state, and voice-activity behaviour, then speak normally while connected to the intended voice channel. If only the image switching is wrong, verify that the two images are assigned to the correct states.
Can I use a different PNGTuber app?
Yes. A local app such as veadotube Mini follows a separate workflow and can be preferable if you want more control over image states or local audio input. Its capture and audio features should not be attributed to FugiTech Reactive Images.