2025-03-28 06:49:07 +01:00

2.0 KiB

type, title, sidebar_label, description, related
type title sidebar_label description related
card Clock card Clock The Clock card shows the current time in a variety of formats and sizes.
docs title
/docs/frontend/#user--or-browser-dependent-settings Setup your time format and timezone

The Clock card shows the current time in a variety of formats and sizes.

Screenshot of the clock card Screenshot of the clock card

{% include dashboard/edit_dashboard.md %}

All options for this card can be configured via the user interface.

Card settings

{% configuration_basic %} Clock Size: description: Adjusts the size of the text allowing a wider range of use with different types of dashboards. Defaults to small. Display Seconds: description: Shows seconds alongside the clock, providing the time format is in a 12-hour format. Time Format: description: Allows the time format to be changed on a per-card level. Defaults to the user profile setting. {% endconfiguration_basic %}

Examples

Basic example:

type: clock

Clock card with no configuration

Screenshot of the basic clock card Screenshot of the basic clock card

type: clock
clock_size: large
time_format: "12"
show_seconds: true
grid_options:
  columns: 12
  rows: 2

Example of a larger clock card for tablet dashboards:

Screenshot of a large sized, 12 hour clock card showing am/pm and seconds Screenshot of a large sized, 12 hour clock card showing am/pm and seconds

A medium-sized clock card better suited for desktop dashboards:

type: clock
clock_size: medium
time_format: "12"
show_seconds: false

Screenshot of a medium sized, 12 hour clock showing am/pm Screenshot of a medium sized, 12 hour clock showing am/pm