Skip to content

A Simple Digital/Analog Clock Card for Home Assistant Lovelace

License

Notifications You must be signed in to change notification settings

shbatm/mm2-clock-card

 
 

Repository files navigation

MM2 Clock Card by @shbatm

Digital/Analog Clock Card for Home Assistant Lovelace based on the MagicMirror2 Clock

This is a direct port of the MagicMirror2 Clock to TypeScript and the Home Assistant card. Credit goes to the original contributers to that project and module.

Screenshot

Screenshot

Options

The following properties can be configured:

Option Description
timeFormat Use 12 or 24 hour format.

Possible values: 12 or 24
Default value: uses value of config.timeFormat
displaySeconds Display seconds.

Possible values: true or false
Default value: true
showPeriod Show the period (am/pm) with 12 hour format.

Possible values: true or false
Default value: true
showPeriodUpper Show the period (AM/PM) with 12 hour format as uppercase.

Possible values: true or false
Default value: false
clockBold Remove the colon and bold the minutes to make a more modern look.

Possible values: true or false
Default value: false
showDate Turn off or on the Date section.

Possible values: true or false
Default value: true
showWeek Turn off or on the Week section.

Possible values: true or false
Default value: false
dateFormat Configure the date format as you like.

Possible values: Docs
Default value: "dddd, LL"
displayType Display a digital clock, analog clock, or both together.

Possible values: digital, analog, or both
Default value: digital
analogSize Specific to the analog clock. Defines how large the analog display is.

Possible values: A positive number of pixels<br> **Default value:**200px`
analogFace Specific to the analog clock. Specifies which clock face to use.

Possible values: simple for a simple border, none for no face or border, or face-### (where ### is currently a value between 001 and 012, inclusive)
Default value: simple
secondsColor Specific to the analog clock. Specifies what color to make the 'seconds' hand.

Possible values: any HTML RGB Color
Default value: #888888
analogPlacement Specific to the analog clock. (requires displayType set to 'both') Specifies where the analog clock is in relation to the digital clock

Possible values: top, right, bottom, or left
Default value: bottom
analogShowDate Specific to the analog clock. If the clock is used as a separate module and set to analog only, this configures whether a date is also displayed with the clock.

Possible values: false, top, or bottom
Default value: top
timezone Specific a timezone to show clock.

Possible examples values: America/New_York, America/Santiago, Etc/GMT+10
Default value: none. See more informations about configuration value here

Installation

Download the 'download.zip' folder from the latest release and store it in your configuration/www folder.

Configure Lovelace to load the card:

resources:
  - url: /local/mm2-clock-card.js
    type: module

About

A Simple Digital/Analog Clock Card for Home Assistant Lovelace

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 94.2%
  • JavaScript 5.8%