app-header-background-color should change to match theme colors.

[okets]

Hello there,
I have an aesthetic request to improve your awesome themes:
app-header-background-color does not match the color scheme of most themes.
in my opinion, it should be the same (or compliment) as the background color used in the theme.
orange themes shouldn't have a brown header, it should be as orange as the background.

[basnijholt]

I am setting the color using the average color that I create like this:

lovelace-ios-themes/create-themes.py

Lines 20 to 24 in c57c648

	def average_color(fname):
	color = Image.open(fname).resize((1, 1)).getpixel((0, 0))
	hex_color = "#{:02x}{:02x}{:02x}".format(*color)
	rgb_color = ImageColor.getrgb(hex_color)
	return "rgba({}, {}, {}, 0.4)".format(*rgb_color)

If you have a better suggestion (or would like to pick colors), let me know! 😄

[okets]

Hello @basnijholt ,
Thank you for the quick response, I love your themes and am thankful for all the hard work put into them.

In my opinion, average colors don't complement the above-header color.
the above header color should complement the main color used in the background images (especially the colors in the top of the background image).
This is my suggestion for the 7 backgrounds in use:
homekit-bg-blue-red.jpg: rgb(30, 2, 61)
homekit-bg-dark-blue.jpg: rgb(48, 69, 124)
homekit-bg-dark-green.jpg: rgb(48, 89, 71)
homekit-bg-light-blue.jpg: rgb(1, 195, 220)
homekit-bg-light-green.jpg: rgb(114, 188, 139)
homekit-bg-orange.jpg: rgb(255, 229, 116)
homekit-bg-red.jpg: rgb(234, 88, 63)

I already changed them manually in my setup, it looks more streamlined than the previous colors.

[basnijholt]

Thanks a lot! I have added your suggestions in #44 and released v2.11.0.

I just added 40% transparency.

Let me know what you think!

[okets]

Hi @basnijholt,
I am sorry for the late response. I have been on a long work trip and didn't have a chance to check this.
It looks better with the changes, but as it turns out, the 0.4 changes the color dramatically and therefore creates a distinction between the status bar and the rest of the application.
My point was to create a seamless header that blends with the app.
If you intended for the status bar to be distinct from the rest of the app, leave it as it is, otherwise, just remove the 0.4 opacity and it will blend in.
I forked the theme and changed it manually (it looks awesome in my opinion).
You can see the difference below:
Opacity 1:

Opacity 0.4