Timer Elements

A Timer Element is a dynamic display component that shows a live countdown or count-up clock on your screen layout. Whether you need to build anticipation before an event, keep meetings on schedule, or track elapsed time, the Timer Element gives you a flexible, real-time clock that updates automatically without any manual intervention.

What Is a Timer Element?

A Timer Element is a screen element that displays a running clock tied to a specific start time, end time, or duration. It can count down toward a future moment or count up from a defined starting point. The timer updates in real time and can be configured to take an action — such as looping, stopping, or showing a message — once it reaches zero.

Common Use Cases

Timer Elements are versatile and suit a wide range of scenarios across different environments:

• Countdown to an event — Build excitement by displaying the time remaining until a product launch, conference keynote, sale start, or any scheduled event.
• Count-up timer — Track elapsed time from a defined start point, useful for live broadcasts, production floor monitoring, or recording how long a session has been running.
• Break timers in meeting rooms — Display a countdown during scheduled breaks so participants know exactly when to return, reducing late starts and keeping meetings on track.
• Presentation time limits — Help speakers stay within their allotted time by showing a visible countdown on a secondary display or confidence monitor.
• Promotional urgency — Show a limited-time offer countdown on digital signage in retail or hospitality environments to encourage immediate action.

Configuring the Timer Element

The Timer Element offers straightforward configuration options that control when the timer starts, when it ends, and which direction it runs.

Start Time

The start time defines the moment from which the timer begins running. For a count-up timer, this is the zero point — the clock increments from this value. For a countdown timer, the start time sets the initial value displayed when the timer first appears on screen.

End Time

The end time defines the target moment the timer is counting toward (for countdowns) or the maximum value before an action is triggered (for count-up timers). When the timer reaches the end time, the configured completion behavior is applied.

Direction

The direction setting controls whether the timer counts down or counts up:

• Countdown — The timer decrements from the start time toward zero (or the end time). Ideal for event countdowns and break timers.
• Count-up — The timer increments from zero (or the start time) upward. Useful for tracking elapsed time during live sessions or production runs.

Display Format Options

The Timer Element supports flexible display formats so you can show exactly the level of time detail your use case requires.

• HH:MM:SS — Hours, minutes, and seconds. Best for timers spanning more than an hour, such as full-day event countdowns or long production sessions.
• MM:SS — Minutes and seconds only. Ideal for short-duration timers like meeting breaks or presentation slots where hours are not relevant.
• SS — Seconds only. Useful for very short countdowns, such as a 30-second transition or a quick audience response prompt.

Choose the format that best matches the duration of your timer. Using HH:MM:SS for a 90-second break timer, for example, would display unnecessary leading zeros and reduce readability on screen.

What Happens When the Timer Reaches Zero

When a countdown timer reaches zero — or a count-up timer reaches its end time — you can choose from three completion behaviors:

Loop

The timer automatically resets to its start value and begins running again. This is useful for recurring intervals, such as a break timer that repeats every 15 minutes throughout a conference day, or a looping promotional countdown on digital signage.

Stop

The timer freezes at zero (or the end value) and remains visible on screen. This is the default behavior for one-time countdowns where you want the audience to see that time has elapsed without any further animation.

Show Message

The timer is replaced by a custom text message when it reaches zero. This is ideal for communicating a clear call to action — for example, displaying "Time's Up!" at the end of a presentation slot, or "Welcome Back" when a break timer expires. The message can be styled to match the rest of your layout.

Styling Options

The Timer Element supports a range of visual styling options to ensure it fits seamlessly into your screen design.

• Font family and size — Choose from available typefaces and scale the timer to be legible at any viewing distance.
• Text color — Set the timer digits to any color to match your brand palette or contrast with the background.
• Background color and opacity — Apply a solid or semi-transparent background behind the timer to improve legibility over complex backgrounds.
• Alignment — Position the timer left, center, or right within its container to suit your layout.
• Padding and border radius — Add spacing around the timer digits and round the corners of the background container for a polished appearance.
• Color change on threshold — Optionally configure the timer to change color (e.g., from white to red) when it drops below a defined time value, providing a visual urgency cue.

All styling changes are previewed in real time within the editor, so you can fine-tune the appearance before publishing your layout.