⏰ CSS-only Accurate, Settable, Animated Analog Clock

Mate Marschalko
13 min readMay 21, 2021

Let’s build a fully-functioning, settable analog clock with CSS Custom Properties and the calc() function. Next week, we will convert it to a digital clock .. all this with no JavaScript 😱

All you need is HTML and CSS

This is an example project from my book, All you need is HTML and CSS:

--

--

Mate Marschalko

Senior Creative Developer, Generative AI, Electronics with over 15 years experience | JavaScript, HTML, CSS