Timer Plugin (Text-Only Countdown with Message)

Timer Plugin (Text-Only Countdown with Message) 2.0

Go to download
Overview Updates (3) Reviews (2) History Discussion
Tioluwani Lowo

Tioluwani Lowo

New Member
Tioluwani Lowo submitted a new resource:

OBS Timer Plugin (Text-Only Countdown with Message) - Timers

OBS Timer Plugin is a customizable countdown timer designed for streamers, speakers, and presenters. It includes:

✅ A control panel dock to set the timer and message
✅ A fullscreen text-only display that’s bold, responsive, and clean
✅ Pause, resume, reset, and auto-message reveal when time ends
✅ Offline-first — no need for a server or internet
✅ Works seamlessly in OBS using local `file:///` paths
Click to expand...

Read more about this resource...
 
got to say looking good so far but got everything setup and press start for a 3 minutes count down and it dosnt start at all,

thanks for sharing your plugin aswell
 
NCC24656 said:
got to say looking good so far but got everything setup and press start for a 3 minutes count down and it dosnt start at all,

thanks for sharing your plugin aswell
Click to expand...
Is probably because you used the "Local File" checkbox in the browser source. You have to use the "file:///" protocol prefix in the URL or it won't work. For example, I must have
file:///C:/Program Files/obs-studio/counter-dock/display.html
instead of
C:/Program Files/obs-studio/counter-dock/display.html
 
PLV said:
Is probably because you used the "Local File" checkbox in the browser source. You have to use the "file:///" protocol prefix in the URL or it won't work. For example, I must have
file:///C:/Program Files/obs-studio/counter-dock/display.html
instead of
C:/Program Files/obs-studio/counter-dock/display.html
Click to expand...
thanks will try this out
 
PLV said:
At the end of the count down, it would be good to have display.html change state into something that Advanced Scene Switcher can hook into so that we can change scenes automatically using Advanced Scene Switcher.
Click to expand...
Will look into that thanks for the feedback
 
Tioluwani Lowo updated Timer Plugin (Text-Only Countdown with Message) with a new update entry:

Version 1.2 - UI Enhancements

feat: add Style tab with theme toggle, custom font settings, and separate color pickers for timer and end message
  • Introduced the Style tab alongside Timer Settings
  • Added theme switcher (light/dark) affecting the control panel only
  • Added font family selector (applies to display)
  • Added individual color pickers for the timer and end message
  • Applied styles via BroadcastChannel to display.html
  • Ensured theme persists via localStorage - Updated layout to support inline...
Click to expand...

Read the rest of this update entry...
 
Tioluwani Lowo updated Timer Plugin (Text-Only Countdown with Message) with a new update entry:

Timer Plugin v2.0

️ Release Notes — Timer Plugin v2.0​


Major Update: The Complete Control & Multi-Session Edition​


Version 2.0 introduces a massive leap forward for customization, flexibility, and workflow efficiency, transforming the OBS Timer Plugin into a full production-ready control system for live events, services, and broadcasts.



✨ New Features​


Multi-Session Management​


  • ...
Click to expand...

Read the rest of this update entry...
 
Hi folks! I think I must be making some kind of obvious mistake, but I'm pretty stuck during install. Can anyone spot what I'm doing wrong?

OBS Version: 32.1.2
Plugin version installed: obs-plugin-countdown-2.2.0-windows-x64.zip
OS: Windows 11

I followed the install guide as follows:
1. extracted obs-plugin-countdown from the zip
2. copied the plugin folder into C:\Program Files\obs-studio\plugins
Note: To do this, I needed to create the plugins folder, since it didn't already exist.
3. restarted OBS

I moved onto following this guide to setup a countdown and got stuck on the first step:
"Add an OBS Text Source to your scene."
When I add a source to my scene, the only options for text I see are "Text (GDI+)" or "Deprecated > Text (FreeType 2)"
I tried both of those, but when I go to the Docks menu, there's no option for Countdown Timers.
I also checked under Tools > Plugin Manager > Installed to see if it was registering as installed, but no sign of the plugin there either.

I'm relatively new to OBS and I've searched around the forums -- what am I missing? TYIA!
 
friendly_mammal said:
Hi folks! I think I must be making some kind of obvious mistake, but I'm pretty stuck during install. Can anyone spot what I'm doing wrong?

OBS Version: 32.1.2
Plugin version installed: obs-plugin-countdown-2.2.0-windows-x64.zip
OS: Windows 11

I followed the install guide as follows:
1. extracted obs-plugin-countdown from the zip
2. copied the plugin folder into C:\Program Files\obs-studio\plugins
Note: To do this, I needed to create the plugins folder, since it didn't already exist.
3. restarted OBS

I moved onto following this guide to setup a countdown and got stuck on the first step:
"Add an OBS Text Source to your scene."
When I add a source to my scene, the only options for text I see are "Text (GDI+)" or "Deprecated > Text (FreeType 2)"
I tried both of those, but when I go to the Docks menu, there's no option for Countdown Timers.
I also checked under Tools > Plugin Manager > Installed to see if it was registering as installed, but no sign of the plugin there either.

I'm relatively new to OBS and I've searched around the forums -- what am I missing? TYIA!
Click to expand...

Step 1 — Download


Go to the GitHub repo and download the ZIP using the green Code button → Download ZIP. Extract the ZIP to a folder on your computer (e.g. a folder called obs-timer on your Desktop). Keep all six files together in that same folder — panel.html, panel.js, panel.css, display.html, display.js, and display.css. Separating them will break the plugin.



Step 2 — Add the Control Panel as a Dock


  1. Open OBS Studio
  2. Click View → Docks → Custom Browser Docks…
  3. Give it a name (e.g. "Timer Panel") and browse to your panel.html file
  4. Click Apply

The panel will appear as a dockable window inside OBS. You can drag it to any edge of the interface.



Step 3 — Add the Display as a Browser Source


  1. In your scene's Sources list, click + → Browser
  2. Name it (e.g. "Timer Display") and click OK
  3. In the properties window, check Local file and browse to your display.html file
  4. Set width to 1920 and height to 1080 (or match your canvas resolution)
  5. Click OK

Pro tip: right-click the source and choose Fullscreen Projector to show it on a second monitor or stage screen without going live.



Step 4 — Start a Countdown


In the Timer Settings tab of the panel:


  • Use the quick preset buttons (1 / 3 / 5 / 10 min) or type any number in the Time (minutes) field
  • Type your end message (e.g. "We are starting now!")
  • Click Start

The display updates instantly. Use Pause, Resume, and Reset to manage the timer mid-session.



Step 5 — Save Sessions


Click the Sessions tab to save named timers. Fill in the session name, duration, and end message, then click Save Session. On the day, hit Load to fill the timer fields, or hit Start next to a session to launch it immediately. Sessions persist between OBS restarts automatically.



Step 6 — Style It


Click the Style tab. All changes apply to the display live — no restart needed.


  • Timer font color, end message color (independent)
  • Font family: Sans, Serif, Monospace, or Cursive
  • Font sizes in px (timer and message separately)
  • Container position — 9 positions from top-left to bottom-right

To save a look, type a name in Preset Name and click Save Preset. To apply it later, go back to the Timer Settings tab, pick it from the Select Preset Style dropdown, and hit Apply.


 
You must log in or register to reply here.
Back
Top