Habit Tracker Pro

A beautiful, responsive habit tracking web application with progress visualization, built with React and Tailwind CSS.

Features

• 📅 Track daily habits with a visual calendar
• 🔥 Streak tracking to maintain motivation
• 🏷️ Categorize habits (Health, Work, Personal, Other)
• 📝 Add daily notes to your habits
• 📊 View monthly progress at a glance
• 📱 Fully responsive design
• 🔄 Persistent data with localStorage
• ✨ Smooth animations with Framer Motion

Technologies Used

• React
• Tailwind CSS
• Framer Motion (for animations)
• Babel Standalone (for in-browser JSX transformation)
• LocalStorage (for data persistence)

How to Use

1. Simply open index.html in your browser
2. Add habits using the input field
3. Mark habits as completed by clicking on today's date
4. View and edit your habit history in the calendar view

No installation or server required - it works entirely client-side!

Customization

You can easily customize:

• Colors by editing the CSS variables in the <style> section
• Categories by modifying the category options in the code
• Layout by adjusting the Tailwind classes

License

MIT License - see LICENSE file for details.

Contributing

Contributions are welcome! Please open an issue or pull request if you'd like to improve the project.

Future Improvements

• User accounts and cloud sync
• Habit statistics and insights
• Export/import data
• Dark mode