You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Section Cards are a useful way to structure dashboards, especially for mobile use. However, they currently use hardcoded styles (font sizes, spacing) and offer limited options for visual customization.
Describe the solution you’d like
Extend Section Cards in two ways:
1. Use theme-based styling:
Replace hardcoded values (e.g. font sizes, spacing, text colors) with standard theme variables like --primary-text-color, --paper-font-*, etc.
This improves accessibility and mobile readability, and allows consistent theme styling across dashboards.
2. Add optional background image support:
Introduce an opt-in parameter (e.g. background_image) that works similar to the one in Area Cards. This would allow a visual background to help visually differentiate sections, particularly in large or mobile dashboards.
Both proposals build on existing Home Assistant frontend features (themes, background handling) and do not introduce breaking changes. They would simply enhance flexibility and allow users to fine-tune the appearance of Section Cards more effectively.
This discussion was converted from issue #25448 on May 12, 2025 22:19.
Heading
Bold
Italic
Quote
Code
Link
Numbered list
Unordered list
Task list
Attach files
Mention
Reference
Menu
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
Uh oh!
There was an error while loading. Please reload this page.
-
Describe the problem you have
Section Cards are a useful way to structure dashboards, especially for mobile use. However, they currently use hardcoded styles (font sizes, spacing) and offer limited options for visual customization.
Describe the solution you’d like
Extend Section Cards in two ways:
1. Use theme-based styling:
Replace hardcoded values (e.g. font sizes, spacing, text colors) with standard theme variables like --primary-text-color, --paper-font-*, etc.
This improves accessibility and mobile readability, and allows consistent theme styling across dashboards.
2. Add optional background image support:
Introduce an opt-in parameter (e.g. background_image) that works similar to the one in Area Cards. This would allow a visual background to help visually differentiate sections, particularly in large or mobile dashboards.
Both proposals build on existing Home Assistant frontend features (themes, background handling) and do not introduce breaking changes. They would simply enhance flexibility and allow users to fine-tune the appearance of Section Cards more effectively.
Beta Was this translation helpful? Give feedback.
All reactions