A clean, beautiful Pomodoro timer with progress ring animation, sound alerts, and session tracking. No install. No server. Just open and focus.
- 25/5/15 minute timer — work, short break, and long break modes
- Animated SVG progress ring — smooth arc with tick marks
- Sound alerts — Web Audio API chime at session end, ticks in final 5 seconds
- Session counter — visual dots track progress toward long break
- Daily stats — total focused minutes, sessions, and streak days
- Auto-save — all settings and stats persist via
localStorage - Settings panel — fully configurable durations and preferences
- Auto-start — optionally start the next session automatically
- Browser notifications — optional desktop alerts
- Zero dependencies — pure HTML, CSS, and JavaScript
Option 1 — Open directly:
Double-click index.html in any modern browser.
Option 2 — GitHub Pages (free live URL):
- Push to GitHub repo
- Settings → Pages → Source: main branch
/root - Live at:
https://YOUR_USERNAME.github.io/REPO_NAME
Option 3 — Local server:
npx serve .
# or
python -m http.server 8080| Key | Action |
|---|---|
Space or K |
Start / Pause |
R |
Reset current session |
S |
Skip to next session |
Escape |
Close settings |
pomodoro/
├── index.html ← App shell
├── css/
│ └── style.css ← Warm brutalist theme, all styles
├── js/
│ └── app.js ← Timer logic, audio, persistence
└── README.md
| Setting | Default | Range |
|---|---|---|
| Work duration | 25 min | 5–60 min |
| Short break | 5 min | 1–15 min |
| Long break | 15 min | 10–30 min |
| Sessions until long break | 4 | 2–6 |
| Sound alerts | On | On/Off |
| Auto-start next | Off | On/Off |
Built entirely with the Web Audio API — no audio files needed:
- Start: two-tone soft ping
- End: warm three-note ascending chime
- Final 5 seconds: subtle tick beep
MIT © 2024