Documentation Center
Everything you need to use VGS Overlays with YouTube, Streamer.bot and OBS.
Quick Start
Fastest path from zero to working chat overlay.
Open Guide
Presets System
Share and import preset styles.
Preset Docs
Quick Start
Open VGS Overlays Builder page.
Enter Host as 127.0.0.1 and Port 8080.
Customize style and size.
Click Copy OBS Link.
Paste into OBS Browser Source.
Builder Controls
Accent changes username and highlight color.
Opacity controls chat box background strength.
Scale changes full chat size.
Font controls message text size.
Avatar toggles profile pictures.
Badges show mod and member icons.
Border toggles card outline.
Side switches left or right alignment.
Animation controls entry motion.
OBS Setup
Add Browser Source.
Paste overlay URL.
Width 900 Height 1400 recommended.
Enable refresh when scene becomes active.
Disable shutdown when hidden.
Streamer.bot Setup
Connect YouTube platform.
Enable WebSocket server.
Use port 8080.
Enable chat listener.
Start stream chat connection.
Preset System
Use preset gallery to load styles.
Copy preset link to share with others.
Export preset file for backup.
Import preset file to restore layout.
Troubleshooting
No chat showing: check Streamer.bot chat connection.
Overlay blank: verify host and port.
Hosted site users must use their own PC IP.
Wrong username: update to latest overlay version.