AnalogClock

A clock face that shows the time of a time zone — for "local time of the client / office" blocks.

Features7APIThemingAccessibility

Basic

Without a timezone the clock shows the local time and moves its hands at the start of each minute.

Time zones

timezone takes an IANA name; ariaLabel puts the city before the time in the accessible name. dt makes the faces smaller.

Kyiv01:32
Lisbon23:32
New York18:32
Tokyo08:32

Seconds

showSeconds adds a second hand that ticks with a small spring and always turns forward.

Fixed time

time shows a fixed time instead of the running clock — here driven by a slider; the hands move with the spring.

Meeting at 09:30

Hands pipe

The txAnalogClockHands pipe gives time (HH:mm) and the hand angles of a time zone — for an own mini clock in a list or a header.

Kyiv 01:32

Design tokens

dt changes the size and every colour of one clock — here a dark face.

Pass through

pt styles the parts — here a rounded square face and a smaller pin.