Hi Nerendran,

As the drop down are HTML select elements you will have some limitation the styling. As each browser has its own native way of rendering.

Some things you can do: https://www.filamentgroup.com/lab/select-css.html

And play with https://stackoverflow.com/questions/19388011/how-to-change-colour-of-blue-highlight-on-select-box-dropdown

Cheers, Andries

Andries is right.

if you are super set on customizing dropdown element, you can make a complex set of clickable elements and listviews.

but I wouldn't do that :D

Hi,

This was what worked for me.

Add this widget to your project - "AutoComplete widget" and use it in the place of reference selector. By default "option" tag is not very customizable by browsers. Using this widget replaces that tag with <li> which supports customization.

Widget: https://marketplace.mendix.com/link/component/2695/AuraQ-Limited/AutoComplete-widget

Add the below styling to your css file and change colour as per requirement

.select2-container--default .select2-results__option--highlighted[aria-selected] {

      background-color:green;

}