Skip to content

dineshsinghdhami/analog-clock

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🕒 Analog Clock

  • A simple and elegant Analog Clock built using HTML, CSS, and JavaScript.

💡 Features

  • Simple and beginner-friendly JavaScript logic.
  • Smooth animations using CSS transitions.
  • Real-time updating clock hands.
  • Fully responsive and clean UI.

📸 Screenshot

Analog Clock Screenshot


⚙️ How It Works

  1. The clock is built using HTML elements for hour, minute, and second hands.
  2. CSS handles the circular design and positioning of hands.
  3. JavaScript calculates the rotation angle for each hand based on the current time.
  4. The hands are rotated every second using the setInterval() function.

🛠️ Technologies Used

Technology Badge
HTML HTML
CSS CSS
JavaScript JavaScript

📁 Project Structure

analog-clock/
│
├── index.html
├── style.css
├── script.js
└── screenshot.png

👨‍💻 Author

Dinesh Singh Dhami
🌐 Portfolio Website
🐦 Twitter (X)
💼 LinkedIn
🐙 GitHub
▶️ YouTube