Flow — Focus Timer

A beautiful, minimalist focus timer that helps you get into deep work. No accounts, no tracking, no bloat. Just you and your flow state.

What You Get

A single HTML file. Open it in any browser — it works offline, no install needed.

Features

• Pomodoro Timer — 25min focus / 5min break / 15min long break. Keyboard shortcuts for everything.
• Task List — Built-in todo list that persists in your browser. Add tasks, check them off, stay organized.
• Stats Tracking — See your daily sessions, total focus minutes, and streak. Data lives in localStorage — private, local, yours.
• Beautiful Design — Dark mode, smooth animations, ambient gradient orbs. Designed to be calming and distraction-free.
• Sound Alerts — Optional chime when a session ends. Uses Web Audio API — no sound files needed.
• Fullscreen Mode — Hit F to go fullscreen. Minimize distractions.
• Keyboard Shortcuts — Space start/pause, R reset, S skip, 1/2/3 switch modes, M toggle sound, F fullscreen, N new task.

Keyboard Shortcuts

Key	Action
Space	Start / Pause timer
R	Reset timer
S	Skip to next mode
1	Focus mode (25 min)
2	Short break (5 min)
3	Long break (15 min)
M	Toggle sound
F	Toggle fullscreen
N	Focus task input

How to Use

1. Open index.html in any modern browser
2. Click "Start" or press Space
3. Focus for 25 minutes
4. Take a 5-minute break
5. Repeat. Watch your streak grow.

Customization

Want to change the timer durations? Open the file and edit the MODES object near the top of the <script> block:

const MODES = {
  focus: { label: 'FOCUS', seconds: 25 * 60, next: 'short' },
  short: { label: 'BREAK', seconds: 5 * 60, next: 'focus' },
  long:  { label: 'LONG BREAK', seconds: 15 * 60, next: 'focus' },
};

Change 25 * 60 to whatever you prefer (e.g., 50 * 60 for 50-minute focus sessions).

License

Personal + Commercial use allowed. You may not resell or redistribute this file as a competing product.