Overlay Guide

Overview

An Overlay is an animated, self-contained HTML scene you drop into OBS as a browser source. It's the full package — background, branding, your gamertag, social links, and optional widgets — all moving together. Use it for stream intro screens, "be right back" cards, ending slates, live banners, and info panels on Twitch and YouTube.

Available Formats

• 16:9 (Horizontal) — The default for Twitch and YouTube desktop streams.
• 9:16 (Vertical) — For TikTok, Shorts, and Reels side-streams. Add Dual format to the bundle for both orientations.

Form Fields — Page 1 (Style)

Overlay name (required) A short library label — never shown on the overlay itself. Tip: Name it by use, e.g. "Warzone Intro" or "Chill BRB".

Format Choose 16:9 or 9:16 (see above).

Generate a full bundle Toggle on to produce a matching set — Starting Soon, Be Right Back, Stream Ending, Just Chatting, and a Thumbnail — in one go.

Template The base layout the AI builds on:

• Starting Soon — a pre-stream intro screen (no live timer)
• Be Right Back — a mid-stream away card
• Stream Ending — a sign-off slate
• Just Chatting — a low-key talking-screen frame
• Live Banner — a compact now-live header
• Info Panels — stacked about/schedule/rules panels for your profile
• Custom — no template; let your description drive the whole layout

Describe your overlay (primary direction) Free-text scene + style description. This leads both the background and the overlay styling. Leave it blank to let the vibe and game picks drive everything. Tip: Lead with the scene, then the mood. "A neon city skyline at night with rain" beats "cool neon background".

Vibe (Advanced — fallback) Overall visual style, used to fill gaps your description leaves out:

• Neon Cyber — electric purple/cyan glow
• Cozy Lo-fi — warm, muted, relaxed
• Esports Pro — sharp, high-contrast, competitive
• Anime — vibrant, illustrative
• Retro Arcade — pixel, 80s, saturated
• Fantasy RPG — ornate, gold, mythical
• Horror Dark — desaturated, eerie
• Minimal Clean — understated, lots of negative space Use Surprise me to randomize the style picks.

Accent style (Advanced) How your accent color renders: Glow (neon bloom), Flat (matte), Gradient (two-color sweep), or Chrome (metallic).

Font style (Advanced) Typography direction — display, clean, monospace, hand-drawn, retro pixel, elegant serif, impact, or condensed.

Animation intensity (Advanced) Subtle, Normal, or Intense — how energetic the motion is.

Foreground structure (Advanced) How text and widgets sit: Framed (classic panels), Frameless (floating text), Organic (curved shapes), or Typographic (bold text, minimal chrome).

Follower / sub goal (Advanced, optional) Adds an animated progress bar toward a target number.

Reference image (optional) Upload a logo, mood board, or color reference for style inspiration.

Include my logo (subscribers) Places your saved channel logo as the topmost layer — pick its position and size.

Form Fields — Page 2 (Identity)

Gamertag / Display name (required when included) Your on-screen name. Toggle off to hide it entirely.

Subtitle / tagline (optional) A short line under your gamertag, e.g. "Variety streams | Mon–Fri".

Stream type (thumbnail/bundle only) A prominent tag like "Ranked Grind" or "Friday Night Streams".

Social links Add the handles you want shown. Toggle the group off to hide them all.

Streaming platforms Where you stream, shown as links. Toggle off to hide.

Monochrome logos Render all brand marks in pure white on a darker chip — cleaner on busy backgrounds.

Tips & Hints

• Lead with the scene, then the mood — the AI fills the rest from your vibe pick.
• Pick a template first; it sets the layout so your description can focus on the look.
• Bundles guarantee a consistent set across all your screens.
• Match your accent color to your channel's brand for instant recognition.
• Use Foreground structure → Frameless for a modern, floating look over gameplay.
• Reference images are for style, not exact logos — the AI interprets, it doesn't copy.

Do's & Don'ts

Do's

• Describe the environment you want ("rainy neon alley", "cozy bedroom with fairy lights").
• Pick a vibe that matches your content mood — lo-fi for chatting, esports for ranked.
• Use the bundle for a cohesive stream package.
• Toggle off identity fields you don't need — less clutter reads cleaner.

Don'ts

• Don't paste a full stream schedule into the description — use the Info Panels template.
• Don't request a live countdown timer; Starting Soon is a static intro screen.
• Don't reuse the same overlay for wildly different games — generate per vibe.
• Don't set a follower goal of 0; leave it blank if you don't want a bar.

Platform Export

Pick a target platform (Discord, Twitch, YouTube, Kick, or Custom) to lock the export to its exact dimensions, format, and size cap. Twitch locks the Info Panels template to 320×160 PNG (transparent). Kick locks overlays to 1200×480 PNG/JPG. Custom applies no constraints.