Awesome Open Source
Awesome Open Source



Check Button Card is a button that tracks when it is last pressed, for the Home Assistant Lovelace front-end using MQTT auto discovery.


  • Shows how long ago you've pressed the button.
  • Automatic sensor configuration using Home Assistant MQTT discovery.
  • Hold button to set custom time.
  • Undo unwanted changes.
  • Due mode to display the due time instead of last press time.


Requires a working MQTT setup with discovery enabled in Home Assistant. For more information check out the Home Assistant documentation.

The card will start in configuration mode and prompt you to create the MQTT config required for auto discovery. If the entity doesn't exist it will be created with the entity provided in the card config. After the button is configured the sensor will show up as a Home Assistant entity and is used by the card to track the last button press.


It is possible to publish to the MQTT topic using automations to update the button state using physical buttons for example (instead of using the UI button).

The payload should be published to the relevant sensor. If you sensor is named sensor.test_button the topic should be homeassistant/sensor/test_button/state. For more information check out the Home Assistant documentation.

Payload Example

{"timestamp":"**timestamp here**","timeout":"2 hours","unit_of_measurement":"timestamp"}

Node Red Example

// Define entity_id
const entityId = "sensor.test_button";

// Get global object
const haObject = global.get("homeassistant");

// Get attributes object from entity
let payloadObject = haObject.homeAssistant.states[entityId].attributes;

// Get current timestamp in seconds
const currentTime = Math.trunc(;

// Modify timestamp in payloadObject.
payloadObject.timestamp = currentTime;

// Modify timeout_timestamp in payloadObject if defined
if (payloadObject.timeout_seconds !== undefined) {
    const timeoutTime = currentTime + payloadObject.timeout_seconds
    payloadObject.timeout_timestamp = timeoutTime;

// Create string from object
msg.payload = JSON.stringify(payloadObject);

return msg;


Name Type Default Description
type string Required custom:check-button-card
entity string Required Sensor entity used to create and publish to.
title string none Title displayed next to the button.
title_position string left Sets the position of the title left, inside.
color string var(--primary-color) Change the base color of the button. Also definable in themes as checkbutton-card-color.
height string 40px Scales the height of the button.
width string 70% Scales the width of the button.
severity array none A list of severity options. * minutes, * hours, * days, * months, * years.
display_limit string none Limits the display of time to a certain value minutes, hours, days, weeks, months, years.
timeout string none Attribute required for due config option. minutes, days, weeks, months, years.
text object none A list defining the text displayed. minute(s), day(s), week(s), month(s), year(s), ago, less_than, more_than, due_by, over_by.
due boolean false Sets the card to display the due time based on timeout value set in the config.
locale string 'en-us' Sets the friendly timestamp locale.
unit_of_measurement string none Define the unit of measurement of the sensor.
icon string mdi:checkbox-marked Define a custom icon for this sensor.
undo_timeout number 15 Time until undo button times out in seconds.
remove boolean false Set to true for removal config mode. Used to remove entity from MQTT discovery.
discovery_prefix string homeassistant Define custom MQTT discovery prefix.
automation object none Allows publishing of custom variables to the sensor attributes.


- type: custom:check-button-card
  title: Default
  entity: sensor.test_button


color: Green
  - value: 5 days
    color: Purple
  - value: 3 days
    color: Red
  - value: 10 days
    color: Yellow
  - value: 1 day
    color: Blue

Color can also be specified in hex format color: '#bfb540'.


Sets the card to display the due time based on timeout value set in the config.

In this mode, the severity values work in reverse with 0 equalling timeout (and negative past this value).

due: true
timeout: 5 days
color: Green
  - value: '-1 day'
    color: Red
  - value: 0 days
    color: Yellow


  year: jaar
  years: jaar
  month: maand
  months: maanden
  week: week
  weeks: weken
  day: dag
  days: dagen
  hour: uur
  hours: uur
  minute: minuut
  minutes: minuten
  less_than: minder dan
  more_than: meer dan
  ago: geleden
  due_in: over
  over_by: over met


  example_value_1: as many values
  example_value_2: as you want


Home Assistant Community Topic

Alternative Project Comparisons
Related Awesome Lists
Top Programming Languages
Top Projects

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Typescript (267,417
String (42,138
Button (18,795
Card (18,772
Sensor (15,789
Mqtt (7,975
Discovery (4,973