A minimalist, distraction-free Pomodoro timer that keeps running even when the popup is closed
Features β’ Installation β’ Usage β’ Tech Stack β’ Contributing
- Overview
- Features
- How It Works
- Installation
- Usage
- Configuration
- Tech Stack
- Project Structure
- Roadmap
- Contributing
- Support
- Author
- License
Pomodoro Timer Extension is a Chrome extension (Manifest V3) designed for developers, students, and productivity enthusiasts who need a reliable timer that works in the background. Unlike traditional web-based timers, this extension continues running even when you close the popup, using Chrome's service worker architecture.
Perfect for:
- Developers practicing the Pomodoro Technique
- Students managing study sessions
- Remote workers tracking focus time
- Anyone seeking distraction-free productivity
- β° Background Persistence β Timer runs via service worker, even when popup is closed
- π Desktop Notifications β Get notified when focus/break sessions end
- π΅ Audio Alerts β Custom ring tone plays at session completion
- π Daily Statistics β Track completed Pomodoros per day with automatic daily reset
- π Auto-Start Options β Automatically begin next focus or break session
- π¨ Customizable Theme β Change button accent color while preserving timer colors
- π Glassmorphism UI β Modern liquid glass design with backdrop blur
- β‘ Smooth Animations β Interactive button states with hover/active effects
- π§ Looping Sound Player β Test and play ambient sounds from the popup
- π± Responsive Design β Clean, minimal interface that adapts to your needs
- βοΈ Flexible Settings β Customize focus (1-180 min), short break (1-60 min), long break (1-60 min)
- π Cycle Management β Automatic long breaks after configurable focus sessions (default: 4)
- πΎ Persistent State β All settings and progress saved in Chrome storage
- π Badge Counter β Extension icon shows remaining minutes while running
- β‘ Quick Templates β Instantly switch between Classic (25/5), Short (15/3), Long (50/10), and Ultra (90/20) timing patterns
- The service worker owns the state (mode, running, start/end times, remaining seconds) in
chrome.storage.local. - When you start a session, the worker schedules an end alarm and a minute badge update alarm.
- The popup reads state and renders a local ticking UI; it does not drive the timer.
- On alarm, the worker flips mode, increments counters, sends a notification, and (optionally) autoβstarts the next session.
- The popup and worker communicate via
chrome.runtime.sendMessage.
- Open Chrome and navigate to
chrome://extensions/. - Enable "Developer mode" using the toggle in the top-right corner.
- Click the "Load unpacked" button and select the extension's directory.
- Pin the extension to the Chrome toolbar for easy access.
One-click timing patterns:
- Classic (25/5/15) β Traditional Pomodoro technique
- Short (15/3/10) β Quick focus bursts for task switching
- Long (50/10/30) β Deep work sessions
- Ultra (90/20/45) β Maximum concentration blocks
Simply click a template button to instantly apply those durations.
- Start/Pause/Reset: Use the popup controls to manage your timer.
- Mode Selection: Choose between Focus, Short Break, and Long Break modes.
- Settings: Click the gear icon to customize your timer durations and auto-start preferences.
- Color Theme: Press the π¨ button to select your preferred button accent color.
- Sound Alerts: Use the Play Sound button to test the break end sound.
| Template | Focus | Short Break | Long Break | Best For |
|---|---|---|---|---|
| Classic | 25 min | 5 min | 15 min | Standard Pomodoro |
| Short | 15 min | 3 min | 10 min | Quick tasks |
| Long | 50 min | 10 min | 30 min | Deep work |
| Ultra | 90 min | 20 min | 45 min | Complex projects |
- Focus Duration: Set the length of your focus sessions (1-180 minutes).
- Short Break Duration: Configure the duration of short breaks (1-60 minutes).
- Long Break Duration: Adjust the length of long breaks (1-60 minutes).
- Auto-Start: Enable or disable automatic starting of the next session.
- Chrome Extensions API: For building the extension and interacting with the browser.
- HTML/CSS/JavaScript: Core technologies used to develop the extension.
- Service Workers: Background scripts that run independently of the extension's UI.
manifest.jsonβ MV3 configurationservice_worker.jsβ background logic: timers, alarms, storage, notificationspopup.htmlβ UI markuppopup.cssβ UI styles (minimal, darkβfriendly)popup.jsβ UI logic and messaging
- Template presets for quick timing changes (Classic/Short/Long/Ultra)
- Custom template creator (save your own presets)
- Implement task and goal tracking
- Provide detailed statistics and reports
- Introduce user accounts and cloud sync
Contributions are welcome! Please read the CONTRIBUTING.md for guidelines.
If you find this extension useful, consider supporting the project:
- β Star this repository on GitHub
- β Buy me a coffee via PayPal
- π Report bugs via Issues
- π¬ Share feedback in Discussions
Your support helps maintain and improve this project!
Minh Duy Do
- GitHub: dominhduy09
- Email: [email protected]
This project is licensed under the MIT License - see the LICENSE file for details.
- Inspired by the Pomodoro Technique
- Built using Chrome Extensions MV3
- Thanks to all contributors and supporters