UX Goodie Theme

Hello there!

I would like to share my brand-new theme – UX Goodie Theme :slight_smile: It’s inspired by iOS Dark Mode and by @basnijholt’s theme.
I have added some rarely used properties and modified lot’s of others. I hope you will like it!

It’s available on HACS and GitHub so don’t hesitate to star it! :wink:

Overview

Logbook

Hass.io

Configuration

Profile

Installation

See installation notes
  1. Add the following code to your configuration.yaml file (reboot required).
frontend:
  ... # your configuration.
  themes: !include_dir_merge_named themes
  ... # your configuration.
  1. Put background.jpg into your /config/www/ directory. For example file see backgrounds/ directory of this repository.

  2. (Optional) Add the following to your lovelace-ui.yaml or use the RAW editor: (you also need to install custom-header) to display date and time in tab bar:

custom_header:
  button_text:
    options: '{{ time }}<br>{{ date }}'
  compact_mode: true

NOTE: options: from above example may not display properly in HACS. Please see GitHub repository.)

HACS

See HACS instructions
  1. Go to the Community Store.
  2. Search for UX Goodie Theme.
  3. Navigate to UX Goodie Theme theme.
  4. Press Install.
  5. Follow point 2 from Installation section above.
  6. Go to services and trigger the frontend.reload_themes service.
  7. (Optional) Follow point 3 from Installation section above.

Manual

See manual instructions
  1. Clone this repository in your existing (or create it) themes/ folder.
cd themes/
git clone https://github.com/home-assistant-community-themes/lovelace-ux-goodie-theme.git

Or using submodules:

cd themes/
git submodule add https://github.com/home-assistant-community-themes/lovelace-ux-goodie-theme.git
  1. Follow points 2 and 3 from Installation section above.
1 Like

Just installed it through HACS. Will give it a spin for a few days. Thanks for the effort and making this community again a bit more complete :smile:

1 Like

Is it possible to make the side bar semi-transparent like the header?

Unfortunately it’s not possible because there’s basically no background (image) below the sidebar. You can do it even 100% transparent, but then sidebar background would appear totally white.

1 Like