Countdown Timer

A countdown timer works the opposite of a stopwatch: you set a target duration, hit start, and it counts down to zero. Ours has an animated progress ring, sound alerts, browser notifications and quick presets — everything you need for cooking, workouts, exams and productivity sprints.

How it works

When you press start, we compute the target end timestamp (`Date.now() + duration`) and then, on every animation frame, subtract the current time from it. This approach is drift-proof: even if the tab is backgrounded and JavaScript pauses, the moment you return the timer instantly shows the correct remaining time. When it hits zero, a Web Audio oscillator plays a beep and, if you've granted permission, a browser notification pops up.

Key features

• Hours, minutes and seconds input
• Animated progress ring showing time remaining
• Sound alert with Web Audio (no external files)
• Browser notifications when the timer completes
• Quick presets (1m, 3m, 5m, 10m, 25m, 1h)
• Pause & resume
• Fully client-side — no ads interrupt the alert

Common use cases

Pro tips

• ◆Allow browser notifications on first use — you'll get an alert even if the tab is behind others.
• ◆The progress ring makes remaining time readable at a glance from across a room.
• ◆Use presets to skip typing during quick sessions.

Common mistakes to avoid

• ✕Setting the timer but leaving the browser muted — always test the sound first.
• ✕Confusing countdown with a stopwatch (which counts up).

Frequently asked questions