Change Title Color & Alignment

[wormuths]

Is there a way to change the alignment of the title for the card? align: left or something like that?

Additionally... Since I have an issue which is not easily solved (I don't think), maybe someone can help me clarify the different values necessary to change element colors on the cards? My theme is built around assigning themes I created to individual cards throughout my dashboards. The Plotly card is pulling colors from the default theme which I don't use... So, for example, I have to specify colors everywhere for all the elements in the Plotly cards...

paper_bgcolor: '#EFDECD'
plot_bgcolor: '#EFDECD

And if changing for labels of an axis...

tickfont:
color: '#000000'

So maybe you nice folks can help me by providing me other examples of values I can use to colorize other elements, like the title text of the card, or legends?

Thanks!

[dbuezas]

To have full control of the title, use the native plotly title (inside layout):

layout:
  title: your title here

Then visit:

• https://plotly.com/javascript/figure-labels/
• https://plotly.com/javascript/reference/layout/#layout-title

To colorize traces and whatnot, see also the plotly docs:

• https://plotly.com/javascript/reference/

I suggest you try the google search term: "how to xyz in plotly javascript" and even ask ChatGPT.
This card uses the plotly library, so for generic plotly questions I can only point you at their docs :)

Regarding themes, I only implemented basic support, the rest needs to be done manually. Alternatively you may find another custom card to customize theme variables for specific cards.
This card uses these

• card-background-color
• primary-background-color
• primary-color
• primary-text-color
• secondary-text-color

Wish you luck!

[falkio8]

@wormuths
did you get any further? I am desperately looking for an option to change the color of the axis title. Those plotly docs didn´t help as I am not able to transfer those infos to the yaml code.

[dbuezas]

You can do that like this:

layout: 
  yaxis: 
    titlefont: 
      color: red # or use hex, but make sure to add quotes so it is not interpreted as a comment "#ff0000"

By the way, https://dbuezas.github.io/lovelace-plotly-graph-card/ this tool i made recently will help you exploring the api.