🕐 World Clock Card — customizable clock (digital & analog) with local time and world zones

Share your Projects! Dashboards & Frontend
1

Hi everyone! :waving_hand:

I just released World Clock Card, a custom Lovelace card that shows your local time as a digital or analog clock and, if you want, adds up to two world time zones — all with a modern interface that’s fully configurable from the visual editor, without writing a single line of YAML.

banner
banner6912×3456 1.58 MB

What it does

  • :one_o_clock: Local digital or analog clock
  • :shuffle_tracks_button: Two layouts — local time centered with the zones on the sides, or a split layout with the zones stacked to one side
  • :bullseye: Analog dial styles — ticks, dots, numbers, roman numerals or numbers-in-circles (quarter / hour / full detail)
  • :globe_showing_europe_africa: Up to 2 world clocks, each with its own label, dial style and color
  • :date: Localized date in six formats, with automatic language detection
  • :triangular_ruler: Four sizes that scale everything proportionally
  • :artist_palette: Colors for the dial, digits and date — with automatic contrast on dark dials
  • :framed_picture: Backgrounds — transparent, image + overlay, or any CSS gradient, plus a light-text mode
  • :hammer_and_wrench: card-mod friendly — CSS variables for every element, so you can restyle it however you like

Install

Available through HACS as a custom repository: https://github.com/korova-sq/world-clock-card

Repo & docs: GitHub - korova-sq/world-clock-card: A clean and customizable world clock card for Home Assistant — digital or analog, with multiple time zones. · GitHub

Feedback, translations and above all new ideas are always welcome! :rocket:

1 Like
2

Your link is missing d on the end.

1 Like
3

Thanks @dcapslock for spotting that! :folded_hands:t2:

The correct link is:

Unfortunately it won’t let me edit the original post anymore.

(If a mod sees this and can fix the link in the first post, that’d be great!)

1 Like
4

Update — v1.1.0 is out! :black_square_button::artist_palette:

Two solid additions to the digital clock this time:

  • :black_square_button: New digital style: Boxes — hours and minutes in coloured boxes (local clock
    only). Just pick it from Dial (digital) → Digital style, no CSS needed.
  • :artist_palette: Separate dial & time colors — the dial/box color and the digits/markers color
    are now independent, both for the local clock and for each world clock zone. Mix and
    match as you like.
  • :level_slider: New “Element position” sliders — nudge hours, minutes, colon and seconds/AM-PM
    up or down, handy to center everything inside a box or just to fine-tune for your font.
  • :pushpin: Seconds and AM/PM now sit in fixed, consistent positions across devices.

Everything from the visual editor, as always. Update via HACS :rocket:

Repo: GitHub - korova-sq/world-clock-card: A clean and customizable world clock card for Home Assistant — digital or analog, with multiple time zones. · GitHub