A sleek web app that combines a Stopwatch and QR Code Generator to help users track their productivity sessions and share them easily.
Whether you’re timing study sessions, workouts, or daily tasks this app helps you record, store, and share your progress in one place.
- Sleek Dark Mode: A polished, high-contrast Black and Gold aesthetic for a professional and focused user experience.
- Fully Responsive Design: Optimized for seamless use on all screen sizes, from mobile phones to desktop monitors.
- Time Tracking: Start, Stop, and Reset functionality for precise session management.
- Session Notes: Option to log a brief note or task description with each completed session.
- Daily Summary: Automatically aggregates total productive time for the current day.
- QR Code Generation:
- Session QR: Generates a unique QR code for individual session data upon completion.
- Daily Summary QR: Generates a QR code containing the full daily activity log for easy sharing or saving.
- Compact Log View: Session history is collapsed behind a toggle button to maintain a clean and compact interface.
The core function of Time2QR is to convert your productivity data into a scannable format for easy transfer or permanent record-keeping.
The QR code for the Daily Summary contains a URL structure that includes a plain-text summary of your session data:
- Total time tracked for the day.
- The duration and note for every session tracked today (e.g.,
S1: 00:30:00 (30 min cardio & abs)).
Since this is a client-side application, the encoded URL (e.g., https://time2qr.app/daily/?summary=...) will not lead to a live website. The goal is to extract the data using your phone's scanner app:
- Scan the Code: Use your smartphone's camera or a dedicated QR code scanner app.
- Copy the Encoded URL: The scanner will extract the full URL. Copy this entire string.
- Use a Decoder Tool: Paste the entire URL string into any available free URL Decode website (just search for "URL Decoder"). The tool will convert the encoded string back into a clean, readable text report.
- Save/Share the Data: Copy this final, clean text report and paste it into a note, document, or spreadsheet for your permanent records.
- HTML5: Structure and content.
- CSS3 (Custom): Full custom styling implemented with a focus on dark-mode principles and the Black/Gold theme.
- JavaScript (ES6+): Core logic for timer, session storage, and data management.
- QRCode.js: External library used for generating the QR code images.
The application uses the following color palette and typography for its professional dark-mode look:
| Element | Color / Font | Description |
|---|---|---|
| Background | #0a0a0a (Deep Black) |
Provides a true, non-distracting dark base. |
| Accent | #ffd700 (Gold/Yellow) |
Used for key data (time display), shadows, and borders to create high contrast. |
| Body Font | Poppins |
Clean and modern sans-serif for general text. |
| Timer Font | Roboto Mono |
Monospaced font for the time display, enhancing readability and a "digital" feel. |
git clone https://github.com/Dakshaaaaa/Time2QR.gitcd Time2QROpen index.html in your browserContributions are welcome! If you have suggestions for features, bug fixes, or improvements, please feel free to:
- Fork the repository.
- Create a new branch (
git checkout -b feature/AmazingFeature). - Commit your changes (
git commit -m 'Add some AmazingFeature'). - Push to the branch (
git push origin feature/AmazingFeature). - Open a Pull Request.
This project is licensed under the MIT License - see the LICENSE.md file for details.
