@@ -63,13 +63,31 @@
       background: black;
       position: absolute;
       top: 50%;
+      transform-origin: 100%;
+      transform: rotate(90deg);
+      transition: all 0.5s;
+      transition-timing-function: cubic-bezier(0.45, 2.51, 0.58, 1);
     }
 
   </style>
 
   <script>
-
-
+    const secondHand = document.querySelector(".second-hand");
+    const minuteHand = document.querySelector(".min-hand");
+    const hourHand = document.querySelector(".hour-hand");
+    function setTime() {
+      const now = new Date();
+      const seconds = now.getSeconds();
+      const secDegrees = (seconds / 60 * 360) + 90;
+      secondHand.style.transform = `rotate(${secDegrees}deg)`;
+      const minutes = now.getMinutes();
+      const minDegrees = (minutes / 60 * 360) + 90;
+      minuteHand.style.transform = `rotate(${minDegrees}deg)`;
+      const hours = now.getHours();
+      const hourDegrees = (hours / 12 * 360) + 90;
+      hourHand.style.transform = `rotate(${hourDegrees}deg)`;
+    }
+    setInterval(setTime, 1000);
   </script>
 </body>
 </html>