🍅 Pixel Pomodoro

A retro-styled productivity timer with modern features and pixel-perfect UI design.

🌟 Features

• 🎮 Retro pixel art design with modern UI elements
• 🔄 Multiple timer modes - Pomodoro, Short Break, Long Break
• 🎛️ Customizable settings for all timing intervals
• 🌱 Visual progress with growing tomato plants
• 🌙 Focus mode for distraction-free work
• 🔊 Sound notifications when timers complete
• 🎨 Multiple themes (Red, Blue, Green)
• 👥 Live user counter showing active users globally
• 📱 Responsive design from mobile to desktop

🚀 Live Demo

Check out my Pixel Pomodoro in action at https://pomodoro-timer-alpha-gilt.vercel.app

🔥 Live User Counter

I built a real-time user counter showing how many people are currently using Pixel Pomodoro. This creates a sense of global productivity community!

• The counter updates in real-time as users connect/disconnect
• Changes are animated with subtle visual feedback
• Status indicator changes color based on the currently selected theme

I implemented this using Supabase Realtime to count active users across all device types.

📦 One-Click Deployment

💻 Local Development

1. Clone the repository

   git clone https://github.com/bhupathii/pomodoro-timer.git
   cd pomodoro-timer

2. Install dependencies

   npm install

3. Set up environment variables

   Create a .env.local file based on .env.example

4. Start the development server

   npm run dev

5. Open http://localhost:3000 in your browser

🔧 Environment Variables

I use Supabase for the live user counter feature:

• NEXT_PUBLIC_SUPABASE_URL: Your Supabase project URL
• NEXT_PUBLIC_SUPABASE_ANON_KEY: Your Supabase anonymous API key

Check out my setup-supabase.md file for my detailed setup notes.

🧰 Technologies Used

• Frontend: Next.js, React, TypeScript, Tailwind CSS
• Animation: Framer Motion
• Real-time: Supabase Realtime
• Deployment: Vercel

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgements

• Pixel art inspired by my favorite retro games
• Sound effects I created with ZzFX
• Pixel font from Google Fonts