Introduction Overlays

Overlays

Tiltify helps us provide a set of overlays that participating streamers can use to easily track donations on.

This is done by using OBS’s Browser Source and a URL associated with each overlay. As such, they can be configured differently on a per-scene basis and combined with things like filters.

Not sure how to add an OBS Browser Source? Check our docs page on how to add a browser source to your scene

We provide two different sets of overlays.

There are “Pre-fab” overlays, which act as all-in-one overlays: useful for streamers with minimal/no custom overlay, or simply want to do as little tweaking as possible.

Pre-fab Overlays:

However, for streamers with extremely custom overlays that really want to fine-tune their overlays, we provide individual components to use in existing overlays.

Component Overlays:

Config

We are limited to only have five (5) overlays (altogether), and as such combine multiple components into a single overlay URL. If you want to only use one component that’s in an overlay with another, see how to separate merged components in our docs page.

Likewise, while most of our components are greyscale to avoid branding problems, some components may have blue as part of their UI colors. To learn why and how to change these colors to match your branding, read through our docs page on changing overlay colors

Quick Reference

Overlay NameDocs PageOverlay URL
Goal BarHerehttps://overlays.tiltify.com/zIM4K3ClcR4AZ31RlX8JX7Iw4gGq-sSp
EventsHerehttps://overlays.tiltify.com/jVlYxQg9VnH4T-JMLAixvbZD3ET_kdm_
QR CodeHerehttps://overlays.tiltify.com/hG-rNs4Q95pDjqRsb34bGkXU7Aw1SIy9
Compact OverlayHerehttps://overlays.tiltify.com/jRFYEmVubY_kUrr8nXvIrTLgAphmP810
Total OverlayHerehttps://overlays.tiltify.com/_p4t7ooy5hF0EgOK0APsjbg3UTuyJowS