Name¶

A name shows the name of a Home Assistant entity anywhere on the card. Use it for a clear label beside a value, icon, graph, or control.

By default, Flexible Horseshoe Card uses the entity name from Home Assistant. You can provide your own name in the entity configuration.

Basic configuration¶

Add names under layout.names:

1
2
3
4
5
6
7
8
9

entities:
  - entity: sensor.living_room_temperature

layout:
  names:
    - id: temperature-name
      entity_index: 0
      xpos: 50
      ypos: 50

entity_index selects the entity whose name is displayed.

xpos and ypos position the name on the card.

Configuration options¶

Use a custom name¶

Set name on the entity when the card should display another name:

1
2
3
4
5
6
7
8

entities:
  - entity: sensor.living_room_temperature

layout:
  names:
    - entity_index: 0
      xpos: 50
      ypos: 50

1
2
3
4
5
6
7
8
9

entities:
  - entity: sensor.living_room_temperature
    name: Living room

layout:
  names:
    - entity_index: 0
      xpos: 50
      ypos: 50

Position and alignment¶

Position the name with xpos and ypos:

1
2
3
4
5
6
7

layout:
  names:
    - entity_index: 0
      xpos: 10
      ypos: 90
      styles:
        text-anchor: start

Use text-anchor to control horizontal alignment:

• start — text starts at xpos
• middle — text is centered on xpos
• end — text ends at xpos

See Positioning and sizing for the card coordinate system.

Text appearance¶

Use styles to change the appearance of the name:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

layout:
  names:
    - entity_index: 0
      xpos: 50
      ypos: 50
      styles:
        font-size: 1.4em
        font-weight: bold
        text-transform: none
        fill: var(--secondary-text-color)
        opacity: 0.8

Common styles include:

See Styling for the complete styling guide.

Shorten long names¶

Use ellipsis to limit the displayed name length:

1
2
3
4
5
6

layout:
  names:
    - entity_index: 0
      xpos: 50
      ypos: 50
      ellipsis: 20

Names longer than the configured length are shortened with an ellipsis.

Color from the entity¶

A name can change color based on the state of its entity:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

layout:
  names:
    - entity_index: 0
      xpos: 50
      ypos: 50

      show:
        item_style: colorstop

      color_stops:
        colors:
          0: green
          50: orange
          100: red

Color stops are applied to the text.

See Color stops for ranges, gradients, palettes, and interpolation.

Related¶

• Area
• State
• Text
• Entities
• Positioning and sizing
• Styling
• Color stops
• Actions
• Animations