A clean, production-ready Pomodoro focus timer for planning tasks, running focused sessions, and tracking daily progress in the browser.
FocusFlow is a lightweight Pomodoro productivity app built with plain HTML, CSS, and JavaScript. It keeps the interface calm and focused: choose an active task, run focus or break sessions, track productivity, and let the app preserve your state locally.
Everything runs in the browser. There is no backend, framework, build step, or account system.
- Pomodoro timer with focus, short break, and long break modes.
- Task manager with categories, estimates, completion state, active task selection, and progress tracking.
- Session history with focus/break labels, duration, task name, and completion time.
- Productivity stats for today's focus sessions, focus minutes, total sessions, and best category.
- Daily goal tracking with progress bar and editable target minutes.
- Daily cleanup time setting to clear session history, daily progress, and completed tasks automatically.
- Sound alerts using a local WAV asset when sessions finish.
- Light and dark themes with saved preference.
- Picture-in-picture timer window for keeping the timer visible.
- Fully local persistence through
localStorage. - Responsive layout for desktop, tablet, and mobile.
- HTML5
- CSS3 with custom properties, Grid, and Flexbox
- Vanilla JavaScript
- Local WAV sound asset
localStoragepersistence
No dependencies are required.
- Clone the repository.
- Open
index.htmlin a browser.
FocusFlow stores app data in namespaced localStorage keys, including tasks, session history, goal, theme, sound preference, timer durations, active task, timer state, and daily cleanup settings.
The daily cleanup setting only clears productivity activity data:
- session history
- completed tasks
- completed pomodoro counts on remaining tasks
- current long-break cycle
It keeps active tasks and user settings safe.
Built with HTML, CSS, and JavaScript.