Add an option to change the highlighting background color of `updatemenus`

[salim-b]

Currently only the normal (i. e. unhighlighted) background color can be changed through the parameter bgcolor. If you set this background to a dark coloring, you most probaby also want to adjust the text font to a bright coloring so that the text is still readable. But then the text becomes pretty unreadable while being highlighted since the highlighting background color is very bright!

Therefore I think an additional parameter bgcolor_active or the like should be introduced.

Additionally, an even more sophisticated solution could involve an automatic adjustment of the text font color and/or background color depending on the color brightness of the user defined bgcolor and/or font.color values (this seems to be already the case with the font color of hoverinfo labels).

[jsandiego]

I'd like to bump this issue. Would be great to have this customization!

[vidasci]

I would also love to see this being implemented, plotly plots with a dark theme look great but it's a big downside having a bright background in updatemenus (and being unable to change it)

[alexandre-pecorilla]

Bump!
Like @vidasci said, the plotly_dark them is awesome but the bright background on the dropdown makes it impossible to see the values when hovering.

[Kinchul]

Bumping again ! It would be very nice to be able to customize these buttons colors !

[isaacbshelton]

@Kinchul I found a workaround in python that may be helpful. See here: plotly/plotly.py#3120 (comment)

[henrychoy]

I'm struggling to find a workaround in js. Can anyone help?

[henrychoy]

I'm struggling to find a workaround in js. Can anyone help?

This is what worked for me: plotLayout['modebar'] = { color: 'lightgray', activecolor: 'white' ,bgcolor: 'rgba(0 0, 0, 0.7)'};

I thought this thread was about the updatemenus buttons, not the default modebar buttons in the top right corner.

[guidoTegaSistemas]

You are correct, I was having a similiar issue but I guess it won't work for this, in any case I believe those are the variables you could tinker with:
https://plotly.com/javascript/reference/layout/updatemenus/