ON STREAM

Elements & overlays

Everything that shows up on your stream — alert pop-ups, the chat box, a goal bar, a subathon timer — is an element. You build and style elements once, then drop them onto an overlay and point OBS at that overlay's URL. This page covers the two kinds of element, how triggers decide when an alert fires, and how to author anything custom.

Two kinds of element

Every element is one of two shapes. Which one you're looking at changes what controls you see in the editor.

Alerts — one-shot, fired by a trigger: An alert plays once when something happens: someone follows, subscribes, sends a gift, cheers bits, raids, or tips. It animates in, holds for a few seconds, then dismisses. The seeded defaults are New follow, New sub / member, Gift received, Cheer (bits), Raid, and Big tip ($5+). There's also a catch-all When anyone does anything and a Speech (read aloud) element for text-to-speech — both seeded disabled so you opt into them.
Persistent widgets — mounted once, react to the live feed: A persistent widget stays on screen for the whole stream and updates as events arrive, rather than firing and dismissing. The seeded defaults are the Chat box, Goal bar, Subathon timer, Prize wheel, Confetti burst, Profit, and AI Camera status (the live AI-Camera prompt + queue). Because they tail the feed continuously, persistent widgets have no Triggers section — you configure them with their own knobs (max messages, goal target, seconds-per-sub, and so on) instead. Elements can also speak: call landmark.tts(text) for a moment worth reading aloud (billed through your TTS) — see the window.landmark API.

Your defaults are pre-seeded the first time you open Elements — you don't create them by hand. Older accounts gain newly-added defaults automatically on their next visit.

Triggers: when an alert fires

Each alert has one or more triggers. A trigger reads like a sentence — “When someone on some platform does something” — and any trigger that matches fires the alert.

Platform scope. A toggle picks Any platform or Specific. “Any platform” matches the canonical event across Twitch, YouTube, Kick, Rumble, and TikTok; “Specific” reveals a platform dropdown and narrows it down.
Event. Follow, subscribe, gift, cheer, tip / super chat, raid, or redemption. The list self-restricts to what the chosen platform actually emits — e.g. Kick has no super chat (Kicks arrive as named gift items), and only Twitch has a first-class raid.

Once you've picked an event, extra gating fields appear so the alert fires only on what you want:

Amount: A minimum on tips / super chats / cheers / gifts — a dollar floor (e.g. tips of $5+) or a native-unit count (e.g. ≥1,000 bits, ≥100 Kicks). Add several triggers on the same event with different floors to run small / medium / huge variants.
Tier: For Twitch subs and gifted subs, gate on a minimum tier (Tier 1+ / 2+ / 3). YouTube member levels are named rather than ranked, so tier isn't offered there.
Gift kind & specific gift: On Kick you can split gifted subs from paid gift items. On Kick and TikTok you can pin the trigger to one specific gift from the catalogue instead of any gift above a count.
Reward: For channel-point redemptions, gate on a specific reward so only that one fires the alert (handy for wiring a redemption to the prize wheel).

Only the highest-priority matching alert fires per event, so the catch-all “When anyone does anything” never shadows your dedicated follow / sub / gift / tip alerts — it's a low-priority fallback for everything they don't cover.

Editing an element

Open any element from Elements to land in the editor: a live preview on the left that replays on every change, and stacked control sections on the right.

Style — accent color, entrance animation, and on-screen time, plus any custom controls a template exposes (sliders, color pickers, selects).
Text — a headline and subtitle, with click-to-insert variable chips like {user}, {amount}, and {gift_name} that are filled in from the real event.
Voice — optional text-to-speech that reads the event aloud on the overlay. Off by default; a Test voice button previews it locally.
Media, Variables, and Recent fires — attach a sound or image, keep persistent counters / leaderboards, and review the last events that fired this element.

Hit Test fire at the top to play the element on the preview and on any open OBS overlay at the same time, so you can confirm it looks right before going live.

Defaults are code-locked — duplicate to customize

The seeded defaults are baselines: you can freely rename, restyle, retarget their triggers, and tune their knobs, but their underlying HTML / CSS / JS is read-only. To rewrite the code, use Duplicate to customize in the editor. That makes an owned, fully-editable copy (code, controls, style, and seed variables) and jumps you to it — the original baseline stays intact. Defaults also can't be deleted, only disabled.

Any element is just code

There are no hardcoded widget renderers. Every built-in — including the chat box, the wheel, and confetti — is authored as code that runs in a sandboxed iframe against the window.landmark runtime. That means you (or the AI assistant) can build anything the defaults don't cover: a leaderboard, a plinko board, a custom celebration. Open the Custom code section of a duplicated element to edit its HTML, CSS, and JS, plus a Properties panel for everything else. Your JS reads the firing event, its merged config, and the live feed, and persists state across OBS reloads:

// Inside a persistent widget — tail the chat feed:
landmark.on("chat", (e) => {
  const p = e.payload || {};
  addLine(p.user, p.text);
});

// One-shot alert — read the event that fired it:
const name = landmark.event.payload.user;

// Read a tuned knob set in the editor:
const max = landmark.config.max_messages;

// Persist a counter across OBS reloads:
await landmark.vars.set("count", n);

The full surface — landmark.event, landmark.mode, landmark.on, landmark.config, landmark.vars, and the buffered landmark.events — is documented in the window.landmark API reference.

Composing onto an overlay

An overlay is a 1920×1080 canvas you arrange elements on. A fresh overlay comes pre-wired with your baseline alert slots; add persistent widgets yourself from the composer. Edits on the canvas only change this placement — position, size, layer, and per-overlay config — never the base element. To change how the element fundamentally looks or what fires it, edit the base element back in Elements.

Go to Overlays and pick (or create) an overlay from the toolbar.
Hit + Add element. Pick one of your alert templates to add it as a positionable alert slot, or pick a widget primitive (chat box, prize wheel, confetti, goal bar, subathon timer).
Drag to move and pull the corner handles to resize. Each element shows a live preview, so the canvas is a true picture of what OBS will render.
Select an element to open the inspector, where you set its per-overlay name, visibility, and widget config. Use ▶ Test event to fire a synthetic event and watch the overlay react.
Hit Copy URL for the whole overlay — or copy a per-element URL from the inspector to give one element its own browser source — and paste it into OBS.

Next: add your overlay to OBS as a browser source →