I love these! I’ve seen them referred to as “hand in hand” clocks and there are a handful of physical manifestations that you can 3d print or make yourself
Cool! I didn't like that the orientation of the clock hands rotated over time, and I made[1] one that maintains the typical analog clock hour/minute hands alignment with 12 o'clock while rotating once per minute on a long second hand.
Scroll down if you don't want to wait for it to finish. Squint, and you might see a 12-ness nested in the epicycles.
Given CSS animations coupled with the new CSS trigonometric functions... this should be doable in pure CSS, minus the initial injection of the current seconds into a CSS variable on page load. There is no reason to do it in CSS, it just sounds like a fun weekend project (unless someone beats me to it, in which case a fun weekday project!)
lol there might be some on my nokia phone .. just let me dig that out of the closet. To be clear this project was moderately large, if i recall the hour hand (which was the longer in my design) was about 1 foot long.
Well it’s helpful for understanding how Ancient Greek astronomers thought the planets moved. Epicycles were used to explain the apparent retrograde motion of Mars.
The black hour hand is moving the same as a normal clock.
The maroon minute hand is rotating at 390 degrees per hour relative to the clock face. It's rotating at 360 degrees an hour relative to the hand it's mounted on.
It reminds me a little of a screen saver called Fractal Clock that I wrote many years ago for MacOS X: https://www.dqd.com/programs/FractalClock/
Sadly, the screen saver stopped working as of (I think) Catalina and I have never gotten around to fixing it. But someone else wrote a very clever web version which you can see here: https://cakenggt.github.io/web-fractal-clock/ and the source repo is here: https://github.com/cakenggt/web-fractal-clock