ThyClock

Stylish analogue alarm clock web-component.

Easy to integrate in your web application and customizable to your needs.
Goes well with any framework, vue, React, Angular, Svelte, solid.js, ember.js, etc.

Download on

Fork me on

Customizable design, multiple instances

Change the colors of hands, dial foreground- and background colors, set brandtext and numerals on dial.

Alarm

Listen to Custom Event "alarm".

Second Hand Animation

Set the "sweeping-seconds" attribute, and the second hand behaves like an automatic watch.

smooth-tick

tick

sweep

Adjustable Numerals

Decide which numerals to be shown.

3,6,9,12

2,4,6,8,10,12

Roman

emoji

Event

Listen to Custom Event "every-second".

Time Shift

Set time to +X or -X hours or minutes.

-2 hours and 20 minutes

+3 hours

+1 hour and 15 minutes

-1 hour