Dash Python dynamic dropdown with different coloured options

I am trying to create a dropdown with variable options where the options are different colours. I would also like the active option to fill the collapsed dropdown.
I have tried dbc.dropdownmenu with dbc.dropdownmenuitems. However, this fails as the collapsed dropdown menu does not update.
I have tried dcc.dropdown. However, the options are not coloured unless ‘active’ and I cannot see a way to colour options in the expanded format.
Would anyone know the best way of achieving this behaviour?

Hey @hail_toad welcome to the forums.

Does this help?

@hail_toad

If you are using dcc.Dropdown, there is an example in the docs for how to format the dropdown labels. See the Styling Components As Option Labels section:

2 Likes

Hi thanks. This looked promising but went for the below answer as I did not have to install additional packages.

1 Like

Thanks, with some extra work this was successful. I had to add additional code to increase the width of the span and a callback to update the style of the dropdown, as my styling involved background colour and there were white edges around the element before doing this.

1 Like