Change part of text color in multiselect

@devdatt_mehta Welcome to the forum! Looking at the docs, I don't believe it is possible.

ran into difficulties as well. looked at using custom CSS but wasn't able to isolate the dropdown options..you might be able to have more success?

Thanks for reply. Any idea about write custom html like in label or write custom css or apply custom html or css before display?

Hey @devdatt_mehta!

It looks like there might be a way to do this with custom CSS but it's a bit of a doozy :sweat: CSS classes also aren't guaranteed between versions so this is by no means a permanent solution:

/* Note: every reference to select1 should be replaced by the id of your dropdown */

/* generates prefixes for each select item */
{{query2.data.item.map((sku, i) => `#select1--0 div:nth-child(${i + 1}) ._jQXT1:before{
  content: '${sku} ';
  color: blue;
}`).join("\n")}}

/* sets the prefix for the selected item */
#retool-widget-select1 ._aH74K:before{
  content: "{{select1.selectedItem.sku}}";
  color: blue;
  padding-right: 0.2em;
}

#retool-widget-select1 ._aH74K{
  display: flex;
  flex-direction: row;
}

#select1--0{
  width: 100%;
}

I don't recommend this as a pattern but it was certainly fun to look into! If this does end up being supported I'll report back here :slightly_smiling_face: