Cannot Move Themes To a Folder

Hello Everybody,

I am trying to move my themes from configuration.yaml to a folder. I have tried everything I could imagine, but nothing worked. I think, I make a stupid mistake that I miss every time.

My configuration.yaml is:

homeassistant:
  packages: !include_dir_named KNX

frontend:
  themes: !include_dir_named  mythemes

# Configure a default setup of Home Assistant (frontend, api, etc)
default_config:

# Text to speech
tts:
  - platform: google_translate

group: !include groups.yaml
automation: !include automations.yaml
script: !include scripts.yaml
scene: !include scenes.yaml

knx:

The themes collection (a file named colors.yaml in the my themes folder) is like:

rot:
  primary-color: "#ff9800"
  light-primary-color: "#ffc947"
  dark-primary-color: "#c66900"
  text-primary-color: "#ffffff"
  primary-background-color: "#37464f"
  sidebar-text_-_background: "#c70b0b"
  paper-card-background-color: "#263137"
  paper-card-header-color: "var(--text-primary-color)"
  secondary-background-color: "var(--primary-background-color)"
  primary-text-color: "var(--text-primary-color)"
  secondary-text-color: "var(--primary-color)"
  paper-listbox-background-color: "var(--sidebar-text_-_background)"
  paper-toggle-button-checked-ink-color: "var(--dark-primary-color)"
  paper-toggle-button-checked-button-color: "var(--dark-primary-color)"
  paper-toggle-button-checked-bar-color: "var(--dark-primary-color)"
  paper-slider-knob-color: "var(--primary-color)"
  paper-slider-knob-start-color: "var(--primary-color)"
  paper-slider-pin-color: "var(--primary-color)"
  paper-slider-active-color: "var(--primary-color)"
  paper-slider-secondary-color: "var(--light-primary-color)"
  paper-slider-container-color: "var(--sidebar-text_-_background)"
  paper-progress-secondary-color: "var(--sidebar-text_-_background)"
  paper-item-selected_-_background-color: "var(--primary-color)"
  paper-item-icon_-_color: "var(--text-primary-color)"
  paper-item-icon-color: "var(--sidebar-text_-_background)"
  paper-item-icon-active-color: "var(--primary-color)"
  paper-grey-50: "var(--sidebar-text_-_background)"
  paper-grey-200: "var(--primary-background-color)"
  label-badge-background-color: "var(--sidebar-text_-_background)"
  label-badge-text-color: "var(--text-primary-color)"
  label-badge-red: "var(--primary-color)"
  label-badge-blue: "var(--light-primary-color)"
  label-badge-green: "var(--dark-primary-color)"
  label-badge-yellow: "var(--text-primary-color)"
  label-badge-grey: "var(--paper-grey-500)"
  table-row-background-color: "var(--paper-card-background-color)"
  table-row-alternative-background-color: "var(--sidebar-text_-_background)"

I always get the error:

Cannot quick reload all YAML configurations because the configuration is not valid: Invalid config for [frontend]: value should be a string for dictionary value @ data[‘frontend’][‘themes’][‘colors’][‘1og’]. Got {‘primary-color’: ‘#ff9800’, ‘light-primary-color’: ‘#ffc947’, ‘dark-primary-color’: ‘#c66900’, ‘text-primary-color’: ‘#ffffff’, ‘primary-background-color’: ‘#37464f’, ‘sidebar-text_-_background’: ‘#f76605’, ‘paper-card-background-color’: ‘#263137’, ‘paper-card-header-color’: ‘var(–text-primary-color)’, ‘secondary-background-color’: ‘var(–primary-background-color)’, ‘primary-text-color’: ‘var(–text-primary-color)’, ‘secondary-text-color’:

Can anybody help me?

Thanks for your time

I think you need a / after mythemes

Thanks for your quick reply.

I have tried it right away, but at least it seems not to be the only problem, because with the slash the problem persists.

… and I have read the tutorial you mentioned up and down without getting any clue…

frontend:
themes: !include_dir_merge_named your_themes

above is if you want/have several themes you want to choose from

Thanks also for your reply. To be exact: There are several themes in the colors.yaml, I just copied only one of them to keep the post shorter.

Unfortunately, this also only changes the error message:

Cannot quick reload all YAML configurations because the configuration is not valid: Invalid config for [frontend]: expected a dictionary for dictionary value @ data[‘frontend’]. Got ‘themes:!include_dir_merge_named mythemes’. (See ?, line ?).

if you use a folder(dir), you should not have several themes in 1 file, thats the idea with the “Folder” mythemes, if you still get errors, i think it’s your color.yaml that is wrong

but this error is maybe for your “intend” in config.yaml and there is no “dash” after themes: in what you just pasted

And to be honest move " default_config: " to the start of your config.yaml

As stupid as one can be…

Your advice was perfectly correct; I forgot the space and got the error message. Now it works, also with multiple colors in one file. I wanted to split them up anyway, just fix the problem before opening another jar.

Thank you for helping me out.

1 Like

please mark my first answer as solution