Way to create a dashboard with MINIMUM amount of padding between cards and object

Configuration Frontend
1

Hi, I’m looking at Way to create a dashboard with MINIMUM amount of padding between cards and object. I’m using kiosk mode to produce bitmaps for e-ink display where every pixel comes at premium.

Below is an example:

1-2
1-2800×480 3.89 KB

As you can see there is an ample space wasted on the sides, at the top, between the cards …

2

Assuming you are using sections mode for your dashboard, you can theme the following gap vars which default to 8px.

My Theme:
  ha-section-grid-column-gap: 2px
  ha-section-grid-row-gap: 2px
1 Like
3

How to “theme it”, and would it be possible to set negative ?

4

For theming in general, see Home Assistant frontend - Home Assistant

No, gap variables can’t be negative. They define CSS gaps of grid elements. You could start to play with negative margins of the div elements in the section grid container. For this you would need card_mod. However I never recommend playing with margins as they can easily break and can other issues.

5

ok, so how to theme this ?

6

Check out the doco - Home Assistant frontend - Home Assistant

7

Thanks, I shall.