10 Best Analog Clocks In JavaScript (2026 Update)

Have ever wanted to display current time in a analog clock?

Here is a list of 10 best and top-downloaded jQuery plugins and Vanilla JavaScript libraries that help developers create custom analog clocks to show the accurate local time on the webpage.

Originally Published Oct 27 2020, updated Jan 08 2026

Table of contents:

• jQuery Analog Clock Plugins
• Vanilla JS Analog Clock Plugins

Best jQuery Analog Clock Plugins

Customizable Analog & Alarm Clock with jQuery and Canvas - thooClock

thooClock is a jQuery plugin used to create a responsive, highly configurable and styleable Analog Clock with alarm functionality using html5 canvas 2D API.

[Demo] [Download]

---

Analog/Digital Clock with Global Timezone and Dark Mode Support

A JavaScript (jQuery) and CSS based clock that features both analog and digital displays, timezone selection across major global regions, and a dark mode option for varied viewing preferences.

Features:

• Real-time analog clock display with hour, minute, and second hands
• Digital time readout with AM/PM indicator
• Global timezone selection spanning multiple continents
• Dark mode toggle with animated sun/moon transition
• >Responsive layout that adapts to different screen sizes

[Demo] [Download]

---

Digital And Analog Clocks With JavaScript (jQuery)

Digital and analog clocks made using JavaScript (jQuery).

[Demo] [Download]

---

jQuery Based Analog And Digital World Clock - jClocksGMT.js

jClocksGMT.js is a jQuery plugin that takes advantage of jQuery rotate and CSS to create analog and digital world clocks based on standard GMT offsets.

[Demo] [Download]

---

Customizable Analog Clock With Timezone Support - htAnalogClock

A jQuery plugin to generate fully responsive, highly customizable, canvas based analog clocks with 7 predefined presets and custom timezone support.

[Demo] [Download]

---

Best Vanilla JS Analog Clock Libraries

Glassmorphism Style Analog Clock With JavaScript And CSS

A stylish Glassmorphism (frosted glass) style analog clock built with JavaScript, HTML, and CSS/CSS.

[Demo] [Download]

---

Simple & Clean Analog Clock JS Library – Clock.js

A lightweight JavaScript library for embedding a responsive classic analog clock on your web page. Built using vanilla JavaScript, SVG, and CSS3 2D transforms.

This analog clock allows you to specify the timezone and choose whether to display the second hand. It’s perfect for displaying time on your website in a clean way.

[Demo] [Download]

---

Neumorphic Style Analog Clock

A simple, Neumporphic style Analog clock (Dark & Light mode) built using plain JavaScript and CSS.

[Demo] [Download]

---

Create Customizable Analog Clocks With JavaScript – MagicClock

A vanilla JavaScript library for creating customizable analog clocks on the webpage. It uses HTML5 canvas and custom clock images to imitate the classic clock look, with a needle sweeping around the clock face.

[Demo] [Download]

---

Analog Clock/Stopwatch Web Component

A highly customizable analog clock & stopwatch component built using Custom Elements.

[Demo] [Download]

---

More Resources:

Want more jQuery plugins or JavaScript libraries to create analog clocks on the page? Check out the jQuery Analog Clock and JavaScript Analog Clock sections.

See Also:

• 10 Best Countdown Timer Plugins In JavaScript
• 10 Best Date And Time Picker JavaScript Plugins