This project presents a sleek and functional analog clock created with HTML, CSS, and JavaScript. The clock not only provides real-time updates for hours, minutes, and seconds but also offers a dynamic user experience with a unique light and dark mode switch.
(https://xensen008.github.io/Analog-clock/)
The code is hosted for demo purpose https://xensen008.github.io/Analog-clock/
- Real-time Updates: Witness the accurate tracking of time with live updates for hours, minutes, and seconds.
- Light and Dark Mode: Customize your viewing experience by toggling between a light and dark theme using the intuitive switch button.
1.Clone the repository to your local machine.
2.Open the index.html file in your preferred web browser.
3.Interact with the clock interface and toggle the theme using the provided switch button.
Just run the code in Any ide (Vscode if git is installed!)
Installation in bash or git/cloud shell
git clone https://github.com/Xensen008/Analog-clock
cd Analog-clock
open the index.html file or activate live server in vscode
- HTML: Structured the content and layout.
- CSS: Styled the clock and implemented the light/dark theme.
- JavaScript: Provided functionality for real-time clock updates and theme switching.
- Font Awesome: Integrated for stylish icons.
index.html
: Contains the structure of the clock.style.css
: Manages the visual presentation and theming.app.js
: Implements the clock functionality and theme switching.
Contributions are always welcome!
Feel free to contribute by opening issues, suggesting enhancements, or submitting pull requests. Your input is valuable!
If you're interested in contributing to this project, follow these steps:
- Fork the project.
- Create a new branch for your feature:
git checkout -b feature-name
. - Commit your changes:
git commit -m 'Add new feature'
. - Push to the branch:
git push origin feature-name
. - Submit a pull request.
Let's code together! 💻🚀
- Special thanks to Font Awesome for providing the icons used in this project.
- I thank this video for helping me build this Project
For support, email sagespeak008@cyberdude.com or join our Telegram channel