TipcodeOpen the studio
Two minutes, one URL

Add a widget to your stream

Your code is a file and works anywhere. This page is about the other half: the live widgets, which are browser sources, a web page composited over your stream. Most desktop broadcasters can load one, so a single setup covers OBS, Streamlabs Desktop, XSplit, vMix, Prism Live, Ecamm Live and TikTok Live Studio.

  1. 1

    Get your widget URL

    Build it in the studio, Widgets tab: pick a widget, style it, copy its URL. That URL is the whole configuration. Nothing to install, no account.

    Open the studio →
  2. 2

    Add a source that loads a URL

    In OBS, under Sources, press + and choose Browser. Name it anything (Tipcode works). The same thing has a different name in some apps: Webpage in XSplit, Web Browser in vMix, Web layer in TikTok Live Studio. Streamlabs Desktop, Prism Live and Ecamm Live all call it Browser, like OBS.

  3. 3

    Paste the URL, set the size, tick two boxes

    Paste your URL. Set width and height to your canvas (1920 × 1080 for most). Tick “Shutdown source when not visible” and “Refresh browser when scene becomes active”: together they mean the widget reloads whenever you show it, so entrances replay and nothing goes stale between scenes.

  4. 4

    You are live

    The widget is transparent everywhere it has nothing to say, so it sits over your scene like glass. Move or scale it like any source. Flip the demo feed on in the studio while you position things, then switch back to live tips.

Where it works

Your code: everywhere, no exceptionsIt is a file, not a feed. Transparent PNG up to 4096px and true-vector SVG, so it goes in any streaming software, any editor, a thumbnail, a banner, a poster or a shirt. Nothing to load, nothing to support, nothing that can go offline. This is the part with no compatibility question.
Live widgets: software that can load a URLAlerts, the goal bar, the camera frame and the rest are a live page, so they need a source that opens one. OBS Studio, Streamlabs Desktop, Prism Live and Ecamm Live call it a Browser source; XSplit calls it Webpage, vMix calls it Web Browser, TikTok Live Studio calls it a Web layer. All of them work, and the URL is stateless, so there is nothing to install and nothing that goes out of date.
Motion, for edited videoThe Code tab’s Motion mode exports the spinning code as a transparent WebM (1024px, 30fps). CapCut, Premiere, DaVinci Resolve, Final Cut and iMovie place it as a see-through layer over your footage. Best rendered in Chrome.
Apps without a browser source: the code still worksSome cloud studios and phone streaming apps only take uploaded images. There, add your code as a transparent PNG from the Code tab and keep your tip link in the description. A PNG is a still, so your code goes on screen while the live widgets wait for an app that can open a page.

Small things that matter

Summon the code on demand.With “Shutdown source when not visible” ticked, toggle the source (or bind a hotkey to it) and the entrance replays every time. Pair it with a timed stay in the studio and the whole moment is one keypress.
One source per element.Want the goal bar in a different corner than the alerts? Add each widget from the Widgets tab as its own browser source and drag them independently.
Match the widget to the scene.A widget is just a URL, so make two variants and let OBS do the switching: the dark-shadow code in your bright-game scene, the plain one in your dark scene. Switching scenes switches the code automatically. For mid-game changes, put both in one scene and bind their visibility to a hotkey.
Size the camera frame by its properties, not by stretching.Open the source's properties and type your camera's width and height (say 1280 x 720) so the frame redraws to fit exactly: any size or shape, even vertical. Dragging a corner scales it uniformly, which is fine; stretching it to a new shape distorts the border, so reshape in properties instead.
Nothing to see yet?The widget is transparent by design. Turn the demo feed on in the studio to see alerts fire while you position, then turn it off before you go live.
Mobile viewers cannot scan your screen.Put your tip link in your description or a pinned message too. The code is for the people watching on another screen; the link is for everyone else.

Have a broadcaster we did not name? If it has a Browser or Web source, it works. Open the studio. Stuck on a step? Email contact@moonyversal.com and say which app you use.