Skip to content

Homeassistant Transparent Dark Gray Theme.

License

Notifications You must be signed in to change notification settings

FaserF/transparentgray

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Transparent Dark Gray

A transparent dark gray theme for Home Assistant

This is my first ever custom theme for Home Assistant.
Thanks to: https://github.com/JOHLC/transparentblue for his dark blue theme, where this theme is based on.

General information

I am using the frontend extion animated backgrounds. Thats the reason that I have removed a background from this theme.
If you want one, please have a look below under Changing the background image. Maybe I will release a darkgray version with a background implemented. As I am using this for my personal interest. Be aware, that I will only be giving limited support and wont accept all pull requests.

Screenshots

transparentgray.yaml
transparentgray.yaml

Button Colors

transparentgray-other.yaml

If you prefer the Gray and Blue buttons (second screenshots below), change the code as below:
#Switches
switch-checked-button-color: '' #Switch On
switch-unchecked-button-color: 'var(--slightly-darker-text)' #Switch Off
switch-checked-track-color: '#009FFF' #Switch background when On
switch-unchecked-track-color: '#767682' #Switch background when Off

HACS installation - recommended

Works only for transparentgray.yaml

  1. Open HACS
  2. Click the tree dots in the upper right
  3. Click custom repositories
  4. Add the URL of this github repo.
  5. Go to frontend
  6. Search for transparent dark gray
  7. Click Install You should now be able to select "transparentgray-LAB" in Home Assistant. Maybe a restart of HA is required.
    "LAB" stands for "Lovelace Animated Background".

Manual Installation - not recommended

  1. Download the transparentgray*.yaml file from this github repo. - Only one, not all!
  2. Upload the downloaded file to your "themes" directory
  3. Add the resource reference to your lovelace config

You should now be able to select this theme in Home Assistant

Changing the background image

Have a look here

Old Version

Version 2021-06-07 looked like this: transparentgray.yaml
transparentgray old version

transparentgray-other.yaml
transparentgray-other.yaml