Skip to content

Repository files navigation

Focusly

Turn minutes into momentum.

Focusly is a modern, dark-mode Pomodoro timer built to help students, developers, and professionals stay focused, build productive habits, and accomplish more through structured work sessions.

Designed with a premium user experience in mind, Focusly combines productivity tools, insightful analytics, and beautiful animations into one seamless application.


✨ Features

⏱️ Pomodoro Timer

  • 25/5/15 default Pomodoro cycle
  • Focus, Short Break & Long Break modes
  • Start, Pause, Reset & Skip controls
  • Customizable timer durations
  • Circular animated progress timer

✅ Task Management

  • Create and manage tasks
  • Mark active focus task
  • Track completed Pomodoros per task
  • Priority labels

📊 Productivity Analytics

  • Daily focus time
  • Weekly sessions
  • Monthly productivity
  • Animated charts
  • Focus statistics dashboard

🔥 Streak Tracking

  • Current streak
  • Longest streak
  • Daily consistency
  • Weekly progress

🌌 Focus Galaxy

Every completed focus session adds a glowing star to your personal galaxy, creating a visual representation of your productivity journey.

📅 Focus Heatmap

GitHub-style contribution calendar showing daily focus consistency.

🎯 Focus Score

Earn productivity ranks based on:

  • Sessions completed
  • Focus time
  • Streaks
  • Consistency

💡 Smart Insights

Receive personalized insights such as:

  • Most productive hours
  • Weekly trends
  • Monthly summaries
  • Focus consistency

🛠️ Tech Stack

Technology Purpose
React Frontend
TypeScript Type Safety
Vite Development & Build
Tailwind CSS Styling
Framer Motion Animations
Recharts Analytics
Lucide React Icons
React Context API State Management
LocalStorage Persistent Data

📂 Project Structure

src/
│
├── assets/
├── components/
│   ├── Timer/
│   ├── Dashboard/
│   ├── Charts/
│   ├── Tasks/
│   ├── Settings/
│   └── UI/
│
├── contexts/
├── hooks/
├── pages/
├── utils/
├── types/
└── App.tsx

🚀 Getting Started

Clone the repository

git clone https://github.com/yourusername/focusly.git

Navigate into the project

cd focusly

Install dependencies

npm install

Start the development server

npm run dev

Development

Prefer working locally? You need Node.js and npm — install with nvm.

git clone <this-repository-url>
cd <repository-name>
npm i
npm run dev

📸 Screenshots

image
  • Landing Page
  • Timer
  • Analytics Dashboard
  • Focus Galaxy
  • Heatmap
  • Task Manager
  • Settings

🎯 Roadmap

  • Cloud sync
  • User authentication
  • AI productivity coach
  • Calendar integration
  • Spotify integration
  • Browser extension
  • Mobile app
  • PWA support
  • Export analytics
  • Team study rooms

🤝 Contributing

Contributions, suggestions, and feedback are welcome!

If you'd like to improve Focusly:

  1. Fork the repository
  2. Create a feature branch
  3. Commit your changes
  4. Open a Pull Request

📜 License

This project is licensed under the MIT License.


💙 Why Focusly?

Most Pomodoro timers simply count down.

Focusly transforms every focus session into measurable progress through insightful analytics, habit tracking, and a distraction-free experience that makes productivity both rewarding and enjoyable.


⭐ If you found Focusly helpful, consider giving this repository a star!

Made with ❤️ for focused minds.

About

Modern Pomodoro timer with dark mode, focus analytics, streaks, tasks, and productivity insights............ :)

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages