2.0.0 - Material You Colors and Components

Material You

Version 2 of this theme is a significant overhaul to streamline development, improve theme efficiency, reduce repeated styles, and to upgrade many components to follow the material design 3 specifications, as described in the README. This theme makes even more use of card-mod to modify Home Assistant components and apply user defined colors to components (when possible).

Customizable Color

You can now set your own base color which is used to calculate accent and primary colors. Can be set globally or per user. Requires card-mod.

Create a template sensor helper named Material Rounded Base Color (entity ID should be sensor.material_rounded_base_color) and give it a hex code of your chosen base color. To set a base color for a specific user, create a custom color per person by creating a template sensor helper named Material Rounded Base Color John Doe (entity ID should be sensor.material_rounded_base_color_john_doe).

If you are using the Home Assistant Android companion app, you can enable the accent color sensor and set your Material Rounded theme sensor to read that to match your phone's color.

NOTE: material you user defined colors are not working on some pages and elements as described in README due to card-mod limitations.

Material 3 Components

Many components have been modified using card-mod to use new Material You stylings, such as the top app bar, navigation bar, drawer, and rail, toggle switches, and the add card button. Note that due to card mod limitations these changes will not appear on all pages in Home Assistant, but should appear on dashboards, the toolbar, the sidebar, more-info popups, and the devices pages.

Full Changelog: 1.6.1...2.0.0

1.6.2

• Fix add card and calendar colors by setting text-primary-color to lovelace-background #16.

Full Changelog: 1.6.1...1.6.2

1.6.1

• Material 3 switches on entities cards (requires card-mod).
• Fix some text from using accent color when it should've been primary text color

Full Changelog: 1.6.0...1.6.1

1.6.0

• CSS variables are defined directly instead of using tokens.
• Removed some unused variables.
• Fix status and navbar colors on mobile app #14.
  • The background colors of the settings pages have changed as a side effect of this.

Full Changelog: 1.5.4...1.6.0

1.5.4

• Create additional version of theme:
  • Material Rounded.
  • Material Rounded No Mod.
  • Material Rounded Transparent Card.
  • Material Rounded Transparent Card No Mod.
• The transparent card versions of this theme now set card backgrounds to match the view background rather than being truly transparent, to fix issues with overlays like dropdowns.
• Remove --background-color.

Full Changelog: 1.5.3...1.5.4

1.5.3

• Remove individual off colors for tile alarms, thermostats, and fans and instead use state-inactive-color in dark mode
  • This makes tile off icon and feature background color consistent across all entities (except for fan speed selector).
  • The fan speed selector tile feature background color is defined differently than all other tile features, which is why it cannot be matched in theme.
  • Value is same as default theme for light mode so removed entirely.

Full Changelog: 1.5.2...1.5.3

1.5.2

• Restore --mdc-icon-button-size for subview back button.
• Add a transparent background version of the theme for use at the card level for easy transparent cards.

Full Changelog: 1.5.1...1.5.2

1.5.1

The Google Home app colors have been updated and this theme has been updated to match.

• Updated colors to match Google Home app
  • Card backgrounds and toolbar colors are now a bit darker.
• Fixes for toolbar icons and labels.
  • All edit icons in current view should now be visible and not tiny.
  • View buttons scale to fit at least five if less than 72px wide or more if possible.
  • Restore view icon scrolling.
  • Reduce size of toolbar menu icons to make more space for view icons.
  • View label improvements
    • Changes opacity if selected.
    • Added padding to separate it from adjacent labels.
    • Wraps if it is made up of multiple words and is too long (wrapping more than once is cut off by bottom of screen).
    • Font size will reduce on smaller width screens.
• state-fan-off-color fixed so tile feature matches colors of other tile features when off.

Full Changelog: 1.4.0...1.5.1

1.4.0

• Created a version of the theme without card-mod toolbar changes.
• Removed custom colors per views.
• Refactored theme to remove unused and repetitive styles.
• Modified styles of view labels to better match the Google Home app.
• Removed and fixed CSS for badges #1.
• Fixed/flipped primary and accent colors to solve issues with visibility on windows like calendar #2.

Full Changelog: 1.3.6...1.4.0

1.3.6

• Fix rgb-primary-text-color.
• Remove problematic styles for badges and alerts.

Full Changelog: 1.3.5...1.3.6