Search code examples
pythonhtmlcssplotly

Plotly change font and background color when hovering dropdown button

Is there a way to add custom CSS to Plotly dropdown buttons? I have the following ones:

...
updatemenus=[
  dict(buttons=[
    dict(
      args=["type", "bar"],
      label="Bar Chart",
      method="restyle",
    ),
    dict(
      args=["type", "scatter"],
      label="Line Chart",
      method="restyle",
    )
  ]
  , direction="down"),
...

But when using a figure with the theme plotly_dark, this is how they look like when hovering: enter image description here

I saw properties bgcolor, bordercolor, borderwidth... but nothing regarding hover styling. Anyone was able to make it work?

Thank you

Solution

  • You should use

    font = dict(color='#000000')

    For example,

    ...
updatemenus=[
  dict(buttons=[
    dict(
      args=["type", "bar"],
      label="Bar Chart",
      method="restyle",
    ),
    dict(
      args=["type", "scatter"],
      label="Line Chart",
      method="restyle",
      )
    ],
  direction="down",
  font = dict(color='#000000'),
  ),
...