Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/xensen008/analog-clock
This project presents a sleek and functional analog clock created with HTML, CSS, and JavaScript
https://github.com/xensen008/analog-clock
analog analog-clock clock html-css-javascript live themes time web
Last synced: 19 days ago
JSON representation
This project presents a sleek and functional analog clock created with HTML, CSS, and JavaScript
- Host: GitHub
- URL: https://github.com/xensen008/analog-clock
- Owner: Xensen008
- Created: 2023-11-15T06:07:57.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-11-21T14:30:45.000Z (about 1 year ago)
- Last Synced: 2023-11-21T15:38:16.358Z (about 1 year ago)
- Topics: analog, analog-clock, clock, html-css-javascript, live, themes, time, web
- Language: CSS
- Homepage: https://xensen008.github.io/Analog-clock/
- Size: 25.4 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Analog Clock Project
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.
![Clock Demo](./demo%20clock.png)(https://xensen008.github.io/Analog-clock/)
## Demo
The code is hosted for demo purpose
https://xensen008.github.io/Analog-clock/## Authors
- [@Arnabjk008](https://www.github.com/xensen008)
## Features
- 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.## Usage/Examples
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.
## Installation
Just run the code in Any ide (Vscode if git is installed!)
**Installation in bash or git/cloud shell**
```bash
git clone https://github.com/Xensen008/Analog-clock
```
```bash
cd Analog-clock
```
```
open the index.html file or activate live server in vscode
```
## Technologies Used- 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.## File Structure
- `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.## Contributing
Contributions are always welcome!
Feel free to contribute by opening issues, suggesting enhancements, or submitting pull requests. Your input is valuable!
## How to Contribute
If you're interested in contributing to this project, follow these steps:
1. Fork the project.
2. Create a new branch for your feature: `git checkout -b feature-name`.
3. Commit your changes: `git commit -m 'Add new feature'`.
4. Push to the branch: `git push origin feature-name`.
5. Submit a pull request.Let's code together! 💻🚀
## Acknowledgements
- Special thanks to [Font Awesome](https://fontawesome.com/) for providing the icons used in this project.
- I thank this [video](https://youtu.be/weZFfrjF-k4?si=d3mtCJHQ4UkljgG7) for helping me build this Project## Support
For support, email [email protected] or join our [Telegram channel](https://t.me/ihackit08)