Themes

Themes control the visual appearance of your overlay widgets — colors, fonts, borders, and animations. Each widget can have its own theme, and some widgets share a global theme.

Widget-Level Themes

Most widgets have a Theme tab in their settings:

• Chat — message card style, username colors, background opacity.
• Alerts — card style, accent color, text font and size.
• TTS — the TTS display on overlay (if visible).
• Goal — progress bar colors and label style.

Open the widget's settings in the dashboard and navigate to the Theme tab to customize.

Live Preview

Theme changes update the overlay in real time. Keep your overlay URL open in a second window while editing to see changes instantly.

Color Palette

All theme colors use standard hex codes. For consistent branding, decide on a 2-3 color palette before customizing — typically:

• A primary color (brand color, used for highlights and accents)
• A background color (dark semi-transparent recommended for readability)
• A text color (usually white or near-white on dark backgrounds)

Font Selection

Fonts available in themes are web-safe and streaming-friendly (loaded from Google Fonts). Avoid very thin or decorative fonts — they're hard to read at stream resolution.

Recommended: Inter, Roboto, Exo 2, Rajdhani, Nunito.

Resetting to Defaults

Each widget's theme settings has a Reset to Default button that restores the original theme. This doesn't affect other widget settings — only the visual theme.

Compositor Presets and Themes

Compositor presets save your widget layout (positions and sizes) but not individual widget themes. Themes are per-widget settings that persist independently of which preset is active.