⏰ Clock & Alarm App

A modern and interactive Clock + Alarm Web App built using HTML, CSS, and JavaScript. This project displays real-time clock functionality along with an alarm system and theme switching.

---

📸 Project Preview

🌞 Light Mode

🌙 Dark Mode

⏰ Set Alarm Popup

🔔 Alarm Ringing Screen

---

✨ Features

• 🕒 Real-time Analog Clock
• 🧮 Digital Time Display
• 📅 Current Date Display
• 🌗 Light / Dark Mode Toggle
• ⏰ Set Alarm Functionality
• 🔔 Alarm Ringing Screen
• 🎯 Interactive UI with smooth design

---

🛠️ Tech Stack

• HTML
• CSS
• JavaScript (Vanilla JS)

---

📂 Project Structure

clock-project/
 ├── index.html
 ├── CSS/
 │   └── app.css
 ├── JS/
 │   ├── app.js
 │   ├── toggle.js
 │   └── alarm.js
 ├── audio/
 │   └── clockwork_music.mp3
 ├── project image/
 │   ├── light-mode.png
 │   ├── dark-mode.png
 │   ├── set-alarm.png
 │   └── alarm-ringing.png

---

🧠 What I Learned

• DOM Manipulation
• Real-time JavaScript (Date & Time handling)
• Event Handling
• UI State Management
• Working with Audio in JavaScript
• Building interactive UI components

---

🚧 Limitations

• ❌ LocalStorage is not implemented yet (alarm data is not saved after refresh)

---

🔥 Future Improvements

• 💾 Add LocalStorage (save alarm data)
• ⏳ Multiple alarms support
• 🔊 Custom alarm sounds
• 📱 Mobile responsiveness improvements

---

🙋‍♂️ Author

Tafajjul Aspiring Web Developer 🚀

---

⭐ Support

If you like this project, give it a ⭐ on GitHub!