Timer
The Timer widget counts down from a fixed duration, or counts up like a stopwatch. It's built for live broadcasts: match clocks, pre-show countdowns, auction deadlines, and any scenario where time on screen needs to be accurate to the second.
Timer doesn't count down to a calendar date — for that, use Countdown. Timer is purely duration-based: a length of time, or elapsed time, not an absolute target moment.
Adding a Timer
Click Timer in the Widgets panel in the sidebar — it's placed immediately at the centre of the canvas, already selected, defaulting to a 5-minute Duration countdown.
Configuration
Select the Timer and open its Design tab.
Direction
| Direction | Behavior |
|---|---|
| Duration | Counts down from a fixed length of time you set (hours, minutes, seconds), stopping — or continuing, depending on End Behavior — at zero |
| Stopwatch | Counts up from zero. Optionally set a "Stop at" time; without one it counts up indefinitely |
End behavior
Shown for Duration mode always, and for Stopwatch mode once a "Stop at" value is set:
| Option | Description |
|---|---|
| Stop and hold | Freezes the display at zero (or the stop value) |
| Continue into negative / past stop value | Keeps counting past the limit |
| Auto-animate out | Fades the widget out after holding the final state for a configurable number of seconds |
Off-air behavior
What happens when the graphic goes off-air:
| Option | Description |
|---|---|
| Pause | Freezes the timer and resumes where it left off when back on-air — the safe default |
| Continue | Keeps running off-air — right for game clocks or time-since-incident counters tracking a real event |
| Reset | Restarts from zero next time the graphic comes on-air — right for per-segment timers |
Threshold states
Add up to 5 rules that recolor the display as time runs low or high — for example, amber under 2 minutes, red under 10 seconds. Each rule has a comparison (≥, >, =, <, ≤, or between), an H:M:S value, and text/background colors. Compared against remaining time in Duration mode, or elapsed time in Stopwatch mode. Rules are evaluated in order — first match wins.
Format
Three presets, live-previewed, or a custom format:
| Preset | Output example |
|---|---|
| Days + H:M:S | 01:04:35:02 |
| Total hours + M:S | 04:35:02 |
| Total minutes + S | 35:02 |
Choose Custom to build your own format from individual tokens (%D days, %H/%h hours padded/unpadded, %M/%m minutes, %S/%s seconds, %T as %H:%M:%S, %R as %H:%M, %E total hours including days, %F total minutes including everything).
For a pre-show countdown under an hour, use Total minutes + S — showing 01:04:35:02 when you only need minutes and seconds looks cluttered.
Segment styling
Override the color, font size, weight, family, or style of individual segments — Days, Hours, Minutes, Seconds, or Separators — independently of the widget's base text style.
Blink separators
Toggle the : (or other separator characters) to blink once per second.
Prefix and suffix
Static text before or after the timer value — for example, a prefix of Time remaining: or a suffix of left.
Example use cases
- Pre-show countdown: Duration
10:00, Format Total minutes + S, End behavior Auto-animate out - Live match clock: Stopwatch, no stop limit, Format Total minutes + S
- Auction deadline: Duration, Format Total hours + M:S, Threshold state turning red under 10 seconds
Bind
From the Bind tab, a Timer can expose Mode, Format, Duration (ms), End behavior, Expired text, Prefix, and Suffix as operator controls or data bindings — plus the fields shared with other objects (Font family, Font size, Background, Fill color, Stroke color, Stroke width). See Bind for how exposing, locking, and control types work.
Target time also appears in the bindable list, but there's currently no Design-tab control for it in either Duration or Stopwatch mode — it looks like a leftover from before Countdown was split into its own widget. Don't rely on it.