Custom card for displaying the current phase of the moon in Home Assistant using the moon integration. This card also (optionally) uses the Sun Entity to determine the background color of the card.
Enable the moon integration by adding the following to configuration.yaml:
sensor:
- platform: moon
Install moon-card by copying moon.js and images from this repo to <config directory>/www/moon-phases on your Home Assistant instance.
Link moon-card inside your ui-lovelace.yaml.
resources:
- url: /local/moon-phases/moon.js
type: module
| Name | Type | Default | Reference | Description |
|---|---|---|---|---|
| type | string | Required | custom:moon-phases |
Card reference |
| entity | string | Required | sensor.moon |
Moon entity |
| entity | string | Optional | sun.sun |
Include if you would like the card to use light mode while sun is up |
type: 'custom:moon-phases'
entities:
- sensor.moon
- sun.sun

