https://github.com/custom-cards/button-card
❇️ Lovelace button-card for home assistant
https://github.com/custom-cards/button-card
home-assistant home-assistant-custom home-automation lovelace lovelace-ui
Last synced: 4 months ago
JSON representation
❇️ Lovelace button-card for home assistant
- Host: GitHub
- URL: https://github.com/custom-cards/button-card
- Owner: custom-cards
- License: mit
- Created: 2018-08-26T15:50:44.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2025-11-10T14:36:48.000Z (7 months ago)
- Last Synced: 2025-11-10T15:18:23.255Z (7 months ago)
- Topics: home-assistant, home-assistant-custom, home-automation, lovelace, lovelace-ui
- Language: TypeScript
- Homepage:
- Size: 17.6 MB
- Stars: 2,298
- Watchers: 42
- Forks: 277
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
- awesome-home-assistant - Button card - Highly customizable button for your entities (2,443★). (Dashboard Cards / 📐 Layout helpers)
README
# Button Card by [@RomRider](https://github.com/RomRider)
[![Stable][releases-shield]][releases] [![Beta][releases-dev-shield]][releases-dev] [![HACS Badge][hacs-badge]][hacs-link] ![Project Maintenance][maintenance-shield]
![Downloads][downloads] [![GitHub Activity][commits-shield]][commits] [![License][license-shield]](LICENSE.md) [![Discord][discord-shield]][discord] [![Community Forum][forum-shield]][forum]
[commits-shield]: https://img.shields.io/github/commit-activity/y/custom-cards/button-card.svg
[commits]: https://github.com/custom-cards/button-card/commits/master
[discord]: https://discord.gg/Qa5fW2R
[discord-shield]: https://img.shields.io/discord/330944238910963714.svg
[forum-shield]: https://img.shields.io/badge/community-forum-brightgreen.svg
[forum]: https://community.home-assistant.io/t/lovelace-button-card/65981
[license-shield]: https://img.shields.io/github/license/custom-cards/button-card.svg
[maintenance-shield]: https://img.shields.io/maintenance/yes/2025.svg
[releases-shield]: https://img.shields.io/github/release/custom-cards/button-card.svg
[releases]: https://github.com/custom-cards/button-card/releases/latest
[releases-dev-shield]: https://img.shields.io/github/package-json/v/custom-cards/button-card/dev?label=release%40dev
[releases-dev]: https://github.com/custom-cards/button-card/releases
[hacs-badge]: https://img.shields.io/badge/HACS-Default-41BDF5.svg
[downloads]: https://img.shields.io/github/downloads/custom-cards/button-card/total
[hacs-link]: https://hacs.xyz/
# Useful links
- [Stable version documentation](https://custom-cards.github.io/button-card/)
- [Dev version documentation](https://custom-cards.github.io/button-card/dev/)
- [HA Discord][discord]
- [button-card forum thread][forum]
# What is `custom:button-card`?
This is a lovelace custom card called button-card for your entities with a **LOT** of configuration options.
- works with any entity
- 6 available actions on **tap** and/or **hold** and/or **double click**: `none`, `toggle`, `more-info`, `navigate`, `url`, `assist` and `call-service`
- **icon tap action**: Separate action when clicking the icon specifically which takes precedence over main card actions.
- **momentary actions** for the card and/or icon: `press_action` and `release_action` (if used, replaces default actions)
- 3 button-card custom actions: `javascript`, `multi-actions`, `toast`
- state display (optional)
- custom color (optional), or based on light rgb value/temperature
- custom state definition with customizable color, icon and style
- custom size of the icon, width and height
- aspect ratio support
- Support for javascript templates
- custom icon
- custom css style
- multiple layout support and custom layout support
- units for sensors can be redefined or hidden
- 2 color types
- `icon` : apply color settings to the icon only
- `card` : apply color settings to the card only
- automatic font color if `color_type` is set to `card`
- blank card and label card (for organization)
- Native blink animation support
- icon rotation animation support
- confirmation popup for sensitive items or locking mecanism
- password or PIN protection for actions
- haptic support for the [IOS companion App](https://companion.home-assistant.io/docs/integrations/haptics)
- support for [HACS](https://github.com/hacs/integration)