Skip to content

πŸ’§ Daily Water Tracker – A simple and interactive web app built with HTML, CSS, and JavaScript to track daily water intake. Features age-based hydration goals, progress visualization, confetti celebration, and water sound effects.

Notifications You must be signed in to change notification settings

SakshiGupta26/Water-tracker-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

9 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ’§ Daily Water Tracker

A simple and interactive Daily Water Drinking Tracker built with HTML, CSS, and JavaScript.
Track your daily water intake, get age-based recommendations, and celebrate when you hit your hydration goals with sound & animations! πŸŽ‰


✨ Features

  • πŸ₯€ Add water intake (default 250ml or custom amount).
  • πŸ”Š Water sound effect plays when you log a drink.
  • πŸŽ‰ Confetti + popup message when you complete your daily goal.
  • πŸ“Š Progress visualization (filling water animation).
  • πŸ‘ΆπŸ‘©β€πŸ¦±πŸ‘¨ Age-based water goals (Infants β†’ Adults).
  • πŸ”„ Undo & Reset options.
  • πŸ’Ύ Local storage support (keeps your progress until reset).
  • β™Ώ Accessible design (screen reader friendly).
  • ⌨️ Keyboard shortcuts:
    • + β†’ Add 250ml
    • Z β†’ Undo last entry
    • R β†’ Reset today’s progress

πŸ“‚ Project Structure

About

πŸ’§ Daily Water Tracker – A simple and interactive web app built with HTML, CSS, and JavaScript to track daily water intake. Features age-based hydration goals, progress visualization, confetti celebration, and water sound effects.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published