A simple, clean, and smart productivity web app designed to help students improve focus, track study time, manage tasks, and build streaks — all in one place.
- Custom timer (choose your own minutes)
- Break timer included
- Beautiful progress ring animation
- Auto alert & alarm sound when timer ends
- Tracks total study minutes
- Daily streak tracking system
- Best day highlight
- Weekly and Monthly insights
- Add tasks with categories
- Mark tasks as completed
- Delete tasks
- Shows next upcoming task
- Tracks total completed tasks
- Save your name
- View your stats: streak, minutes, completed tasks
Choose from multiple colorful themes:
- Red
- Blue
- Purple
- Green
- Orange
- Pink
- Dark Mode
Achievements unlock automatically:
- ✔ First 30 minutes
- ✔ 1 hour study
- ✔ 5 tasks completed
- ✔ 3-day streak
- ✔ 7-day streak
- HTML
- CSS
- JavaScript
- Firebase Firestore
- Netlify (deployment)
study-timer-app/ │── index.html │── style.css │── script.js └── ring.mp3
- Set your custom study time
- Start the timer
- When the session finishes:
- Alarm sound plays
- Minutes are added
- Streak updates
- Data saved to Firebase
This app uses Firebase Firestore to store:
- Total study minutes
- Streak
- Last study date
Your progress stays saved even after closing the browser.
This project is deployed with Netlify.
You can host your own version easily by using Netlify Drop.
Adity
A student passionate about coding and building useful tools.
If you like this project, please star the repository ❤️
It motivates future improvements!