[SOLVED] How would I color individual dropdown labels? Or how would I add an icon to each?

I have a Perspective drop-down component with multiple options (value / label pairs). Is there a way to change the background color of a particular option based off of the label? For example, if I have a label "Workstation1" and want to make that particular selection a red background how would I do that? Alternatively, I would accept adding an icon to various Workstations from the list. I am familiar with CSS injection, and the stylesheet.css, I am just unsure of how to implement the actual color change and/or icon addition.

There are some earlier threads on the forums but they seem to go right from drawing a circle to drawing the owl.


The post by @victordcq goes into pretty good detail about what CSS to use and where, or are you trying to do something different to this?

1 Like

That worked for me. This link didn't come up in my original search.



Is it possible to inject this dynamically at load time however without stylesheet.css? The user that is requesting this is still running 8.1.21 which does not include stylesheet.css

1 Like

This is where I get lost.

I think @victordcq means put the code on the dropdown component binding however it is never stated what binding to put it on.

I think this is referring to victordcq's js/html injection technique using the markdown component:


I've never tried it but there's some example projects that might shed some light on how it's done:

If I figure out how exactly to use it, I'll reply with more details. Or maybe someone else will chime in.

EDIT: I got it working like this.
So the injection works on the dropdown option's label value, in this case, "YourLabel".

Somewhere on the same view, you want a markdown component, it can probably be invisible but in this case I have it visible because I'm just using the existing example:


Make sure the markdown.escapeHtml prop is set to false and the binding you want to set is on the source prop:

The injection payload goes inside the script transform.


You figured it out 3 minutes before me. I had downloaded his project dndjsinject and figured it out finally.

Thank you for your help! I won't repeat your work here since you already added all the screenshots.

1 Like

Tip: we don't edit our question titles with [SOLVED]. We're much more discreet and just used the Solved checkbox (which you've correctly done) and it's automatically shown on the forum index.
Subtle is good!

1 Like