Browser-source countdown widget

Free Stream Timer Widget

Create a stream timer widget for OBS, Streamlabs, browser sources, starting soon scenes, breaks, and live show handoffs. Use a clean countdown display that can be captured by streaming software or controlled from an XTimer room.

Use the tool Create controlled room

Built for this job

Streamers can show a readable countdown inside a scene or browser source.

Producers can control the countdown while the stream captures a clean viewer display.

Widget-style presets cover starting soon, breaks, and live segment handoffs.

Countdown to

Upcoming event

Days

Hours

Minutes

Seconds

Created with XTimer

Widget presets

Widget settings

Event nameTarget date and time

Theme

Embed code

<div class="xtimer-countdown" data-target="" style="font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; max-width: 560px; border: 1px solid #e4e7ec; border-radius: 16px; padding: 24px; background: #ffffff; color: #1a1b25;">
  <p style="margin: 0 0 12px; font-size: 14px; opacity: .72;">Countdown to</p>
  <h2 style="margin: 0 0 20px; font-size: 24px;">Upcoming event</h2>
  <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; text-align: center;">
    <div><strong style="display:block; font-size: 32px;">0</strong><span style="font-size: 12px; opacity: .72;">Days</span></div>
    <div><strong style="display:block; font-size: 32px;">0</strong><span style="font-size: 12px; opacity: .72;">Hours</span></div>
    <div><strong style="display:block; font-size: 32px;">0</strong><span style="font-size: 12px; opacity: .72;">Minutes</span></div>
    <div><strong style="display:block; font-size: 32px;">0</strong><span style="font-size: 12px; opacity: .72;">Seconds</span></div>
  </div>
  <p style="margin: 18px 0 0; font-size: 12px; opacity: .65;">Created with XTimer</p>
</div>

Create controlled room

Use this setup in XTimer

Need a controller link, viewer display, or shared room?

Keep this simple timer for quick work. Move into an XTimer room when one person controls the clock and another screen shows it to a speaker, team, class, or audience.

Open in XTimer room

Presets that match real work

Start from a timer people already understand.

Each preset has a clear use case, duration, and workflow. That makes the page useful for search visitors immediately, and gives professional users a natural path into XTimer rooms when they need separate controller and viewer devices.

Starting soon widget

10 min

Total

10 min

A 10-minute stream widget for starting soon scenes and pre-show countdowns.

Break widget

5 min

Total

5 min

A 5-minute countdown widget for intermissions and stream breaks.

Show handoff

2 min

Total

2 min

A 2-minute countdown widget for guests, segments, and live handoffs.

Professional setup

Use the simple timer first, then graduate to controlled timing.

Capture the clean viewer display in OBS or Streamlabs, not the controller.

Use short countdowns for breaks so viewers know when the stream returns.

Label the timer clearly: Starting Soon, Back in 5, or Next Segment.

Create an XTimer room when a producer controls timing from another device.

Frequently asked questions

What is a stream timer widget?

A stream timer widget is a browser-based countdown you can capture in OBS, Streamlabs, or another live production tool for starting soon scenes, breaks, and show handoffs.

Can I use this as an OBS browser source?

Yes. Open the clean timer display as a browser source or capture window, then use fullscreen or an XTimer room for separate control.

Can a producer control the stream widget?

Yes. Create an XTimer room so one device controls the countdown and another device shows the viewer display captured by the stream.