Want to change the font size in a tile card

Configuration Frontend
1

I am trying to get a card to navigate on every dashboard since the back arrow chip is not consistent enough on my iphone.

By using the code below, all I get is the two buttons with three completely different fonts. I have Card-mod installed via HACS but it doesn’t seem to do much when I have tried some changes in YAML

Does anyone have any suggestions on what I need to change in the script to get a font I can adjust?

Any help would be appreciated.

image

type: grid
columns: 2
square: false
cards:
  - type: tile
    entity: sensor.date_time
    style: |
      ha-card {
        --tile-primary-font-size: 24px !important; /* Adjust as needed */
        --tile-secondary-font-size: 16px !important; /* Adjust as needed for the unit/name */
      }    entity: sensor.time
    features_position: bottom
    vertical: false
    card_mod:
      style: |
        .tile-content { /* Targets the main content area */
          --tile-font-size: 40px !important; /* Adjust the value as needed */
        }
        .entity-name { /* Targets the entity name */
          font-size: 16px !important; /* Adjust the value as needed */
        }
        .entity-state { /* Targets the entity state (the value) */
          font-size: 100
          px !important; /* Adjust the value as needed */
        }
    tap_action:
      action: navigate
      navigation_path: /dashboard-mobile
  - type: entity
    entity: sensor.xxx_iphone_battery_level
    alignment: centre
    style: |
      :host {
        --card-mod-entity-row-primary-font-size: 132px;
      }
2

Start with this…

type: tile
entity: sun.sun
card_mod:
  style:
    ha-tile-info$: |
      .primary {
        line-height: 1.55em !important;   
        font-size: 1.55em !important;
        color: cyan !important;
        }
      .secondary {
        line-height: 1.3em !important;   
        font-size: 1.3em !important;
        color: red !important;
          }

image
image776×146 5.32 KB

Your code is all over the place. You have multiple card mod instances going.

3

Thank you for that. I was able to make some of the changes i want. Still working on the other types of cards. Each card seems to have its own script to change the font etc.

I actually got the code for Gemini AI. But it did not work very well.
thanks

4

AI doesn’t do well with HA and isn’t recommend. You are correct, each card requires specific code, but most of the time you can find the information in this forum.

Check out this thread if you haven’t already.