Tile Card


The tile card gives you a quick overview of your entity. The card allows you to toggle the entity and show the more info dialog. A badge is shown for some entities like the climate or person entities.

Screenshot of the tile card Screenshot of the Tile card.

To add the Tile card to your user interface, click the menu (three dots at the top right of the screen) and then Edit Dashboard. Click the “Add Card” button in the bottom right corner and select Tile from the card picker.

Configuration Variables

type string Required

tile

entity string Required

Entity ID.

name string (Optional)

Overwrites the name of entity.

icon string (Optional)

Overwrites the icon of entity.

color string (Optional, default: state)

Set the color when the entity is active. By default, the color is based on state, domain, and device_class of your entity. It accept color token or hex color code.

show_entity_picture boolean (Optional, default: false)

If your entity has a picture, it will replace the icon.

tap_action map (Optional)

Action taken on card tap. See action documentation. By default, it will show the “more-info” dialog.

icon_tap_action map (Optional)

Action taken on icon card tap. See action documentation. By default, it will toggle the entity (if possible), otherwise, show the more-info” dialog.

Example

Alternatively, the card can be configured using YAML:

- type: tile
  entity: cover.kitchen_window
- type: tile
  entity: light.bedroom
  icon: mdi:lamp
  color: yellow
- type: tile
  entity: person.anne_therese
  show_entity_picture: true

Available color tokens

Some color tokens are available to colorize the tile card : primary, accent, disabled, red, pink, purple, deep-purple, indigo, blue, light-blue, cyan, teal, green, light-green, lime, yellow, amber, orange, deep-orange, brown, grey, blue-grey, black and white.