https://github.com/tusharnankani/AnalogClock

Analog Clock with added Neomorphic effects.
https://github.com/tusharnankani/AnalogClock

aesthetic clock dark-mode html-css-javascript javascript light-theme neomorphic neomorphism time

Last synced: 6 months ago
JSON representation

Analog Clock with added Neomorphic effects.

• Host: GitHub
• URL: https://github.com/tusharnankani/AnalogClock
• Owner: tusharnankani
• License: mit
• Created: 2020-06-26T10:18:11.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2020-11-18T17:43:36.000Z (almost 5 years ago)
• Last Synced: 2025-03-31T05:22:43.234Z (6 months ago)
• Topics: aesthetic, clock, dark-mode, html-css-javascript, javascript, light-theme, neomorphic, neomorphism, time
• Language: CSS
• Homepage: https://tusharnankani.github.io/AnalogClock/
• Size: 26.4 KB
• Stars: 19
• Watchers: 2
• Forks: 1
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          

# Analog Clock

### This website is deployed [here.](https://tusharnankani.github.io/AnalogClock/)

### *Features*:

* User-friendly

* Displays current Time

* Neomorphic Interface 

* Added Themes: Dark Mode <-> Light Mode

## *Features to be added*

- Adding Timezones 

- Adding a stopwatch / timer (countdowns)

## *Technologies used*

- HTML5

- CSS3 (with Flexbox)

- Vanilla Javascript

## *References*

* For Fonts: [Google Fonts](https://fonts.googleapis.com/css2?family=Work+Sans:wght@300&display=swap)

* For Color Coordination: [w3schools](https://www.w3schools.com/colors/colors_mixer.asp?colorbottom=000000&colortop=FFFFFF)

* For Date and Time function: [Date and Time JS](https://javascript.info/date#setting-date-components)

* For Neomorphism: [Writing CSS for Neomorphism](https://www.youtube.com/watch?v=Gv0dy51SYL0)

* Help for Neomorphism: [Neomorphism](https://neumorphism.io/)

* More about Neomorphism: [CSS-tricks](https://css-tricks.com/neumorphism-and-css/)

## Website Demo:

![1](https://user-images.githubusercontent.com/61280281/85862463-6e0a9a00-b7df-11ea-806e-2ebbeda2ab0c.png)

![2](https://user-images.githubusercontent.com/61280281/85862468-6fd45d80-b7df-11ea-8142-435302297a22.png)

![3](https://user-images.githubusercontent.com/61280281/85862470-706cf400-b7df-11ea-8e31-90f2f8ae4a2e.png)

# *Author*

* Tushar Nankani (tusharnankani, tusharnankani3@gmail.com)

   - [LinkedIn](https://www.linkedin.com/in/tusharnankani)