Ever hidden your taskbar for a coding interview on LeetCode and completely lost track of time? I have.
That's why I built Timer. While modern platforms have made their timers more complex, and other extensions disappear when you switch tabs, this tool brings back simple, persistent functionality. It's inspired by the clean, minimalist design of classic coding platform timers—it just works.
- Always Visible & Persistent: The timer stays on the page even when you switch tabs. It even remembers its state if you close and reopen your browser.
- Real-Time Sync: Start, stop, or reset the timer on one tab, and the state is instantly updated across all your other open tabs.
- 🎨 Enhanced Design: Updated with improved typography, better icon sizing, and refined visual styling for a more polished look.
- 🖱️ Drag & Drop Positioning: Simply drag the timer anywhere on the page to set a custom position. No more being limited to preset corners!
- ⚡ Smooth Interactions: Optimized dragging experience with immediate response and smooth movement.
- 📱 Responsive Layout: Better box-sizing and improved time display formatting for consistent appearance.
- Minimalist UI: A clean, simple interface with just the essentials: Start, Stop, and Reset. No distractions.
- Collapsible Design: Click the arrow to collapse the controls into a single, unobtrusive icon.
- Fully Configurable: Use the extension popup to:
- Toggle the timer's visibility on and off.
- Choose from preset positions (top-left, top-right, bottom-left, or bottom-right).
- Or drag the timer anywhere for custom positioning.
Note: This extension is currently under review by the Chrome Web Store team. The official installation link will be added here once it's live. For now, you can install it directly from the source.
- Download: Download this repository as a
.zipfile from GitHub and unzip it. - Navigate: Open Chrome and go to
chrome://extensions. - Enable Developer Mode: Turn on the "Developer mode" toggle in the top-right corner.
- Load the Extension: Click on the "Load unpacked" button and select the unzipped folder containing the project files.
- Controls: Use the Play, Pause, and Reset icons directly on the webpage to control the timer.
- Collapse/Expand: Click the arrow icon to collapse the timer, and click the timer icon to expand it again.
- Drag & Drop: Simply click and drag the timer anywhere on the page to position it exactly where you want it.
- Settings: Click the Timer icon in your Chrome toolbar (next to the address bar) to open the settings popup. From here, you can show/hide the timer and change its position.
- 🎨 Visual Improvements: Enhanced design with better typography, improved icon sizing, and refined styling
- 🖱️ Drag & Drop: Full drag-and-drop positioning - move the timer anywhere on the page
- ⚡ Performance: Optimized JavaScript positioning logic for more reliable behavior
- 📱 Better Layout: Improved box-sizing and time display formatting
- 🔧 Code Quality: Refactored architecture with centralized assets and cleaner code organization
- Core: JavaScript (ES6), HTML5, CSS3
- Architecture: Chrome Extension API (Manifest V3)
- APIs:
chrome.storagefor persistence and sync,chrome.runtimefor communication - Assets: Centralized SVG icons and CSS in modular structure
Contributions, issues, and feature requests are welcome! Feel free to check the issues page.
This project is licensed under the MIT License with Commercial Use Restriction.
- ✅ Personal use
- ✅ Educational purposes
- ✅ Non-commercial projects
- ✅ Open source contributions
- ❌ Commercial applications
- ❌ Paid products/services
- ❌ Business use
- ❌ Revenue-generating activities
For commercial licensing inquiries, please contact: [your-email-here]
Note: This dual-licensing approach allows free personal use while protecting commercial interests. If you're unsure whether your use case requires a commercial license, please reach out for clarification.