Streamities

How to add Stream Avatars Hub to OBS

The same mascots as Stream Avatars, in a place instead of an event. Whoever talks in chat takes a free seat at the fire, turns to face it, and stays there until they have been quiet for a while. Nothing fights, nothing scores, nobody walks around: it is a scene you can leave on screen all stream.

Takes about 2 minutes

Sign in to Streamities

Mit der Anmeldung akzeptierst du unsere AGB und bestätigst, unsere Datenschutzerklärung zur Kenntnis genommen zu haben.

Step by step

  1. 1

    Sign in and create the widget

    Open the Streamities dashboard, choose Stream Avatars Hub, and create one. Style it now or leave the defaults — the overlay URL works either way and picks up changes as you make them.

  2. 2

    Copy the overlay URL

    Every widget has its own unique URL. Copy it from the widget's page in the dashboard: it is the only thing you need in OBS, and it stays valid, so this is a one-time step.

  3. 3

    Add a Browser Source in OBS

    In your scene, add Sources → Browser, give it a name, and paste the URL into the URL field. Streamlabs and XSplit have the same source type under the same name.

  4. 4

    Set the size to 1920 × 1080

    Type 1920 into Width and 1080 into Height. Size the source rather than scaling it afterwards — a stretched Browser Source renders soft text, because OBS is upscaling a finished image.

  5. 5

    Uncheck "Shutdown source when not visible"

    With that option on, OBS destroys the page whenever the scene isn't active and the live connection goes with it, which looks exactly like a widget that stopped updating. Leave it off, drag Stream Avatars Hub into place, and you're done.

Recommended Browser Source settings

A starting point for Stream Avatars Hub, not a rule — every overlay fits itself to the box you give it. Set the width and height here, then position the source in your scene without resizing it.

Width
1920
Height
1080
Where to put it
Over the full canvas, at your stream's resolution: this one positions itself inside the source.

Leave the source's transform at 100%. Scaling a Browser Source afterwards upscales a rendered image, which is what makes overlay text look soft.

Good to know

Pick how big the gathering is

Hubs seat 64 up to 1024. The bigger the hub, the further back the whole scene is drawn, as if the camera pulled away, so everybody still fits.

The best seats fill first

Places are taken from the fire outward, so a quiet chat is a close circle around the flames instead of a few specks scattered over an empty field.

Same chat, same controls

Who appears follows the Stream Avatars settings you already know: everyone, subs only, allow and block lists, and speech bubbles on or off.

If it doesn't show up

The source is blank or black+

Refresh the source (right-click → Refresh) and check that the URL was pasted in full. A source that is black on first load and fine after a refresh is usually hardware acceleration — enable it under Settings → Advanced in OBS.

It worked, then stopped updating+

Almost always "Shutdown source when not visible". With it on, OBS kills the page whenever you switch scenes and the live connection goes with it. Turn it off in the source properties.

The text looks blurry+

The source is being scaled. Reset the transform (right-click → Transform → Reset Transform) and set the width and height in the source properties instead — 1920 × 1080 is the size to start from.

It's the wrong size in my scene+

Change Width and Height in the source properties rather than dragging the corner handles. Dragging scales the rendered image; the properties change what gets rendered.

Stream Avatars Hub: common questions

Is Stream Avatars Hub free?+

Yes. Every plan includes one Stream Avatars Hub widget, live updates and the default look included. Creator+ adds unlimited widgets of every type, plus full styling, animations and the premium templates.

What Browser Source size should I use for Stream Avatars Hub?+

Start at 1920 × 1080 pixels, set in the source properties rather than by scaling the source in your scene — the widget fits itself to whatever box it is given.

Does Stream Avatars Hub work with Streamlabs and XSplit?+

Yes. Stream Avatars Hub is a normal web page, so it works in any streaming software with a browser or web overlay source — OBS Studio, Streamlabs, XSplit and the rest.

How long does Stream Avatars Hub take to set up?+

A couple of minutes. Create it in the dashboard, copy its URL, paste it into a source. Styling can happen later, live, without touching OBS again.

Do I need to install a plugin?+

No. There is nothing to download and no plugin to keep updated — Stream Avatars Hub is one URL, and it updates itself on our side.

See everything Stream Avatars Hub can do →

Other setup guides