Giving a colour to multi-select at initialization


Hi all,

Two topics on top of each other is going to look desperate, but my efforts have been mostly unfruitful due to my inexperience. I’d greatly welcome your help.

Many thanks to kevin-brown (over at GitHub, can’t find his username here) whose jsfiddle I forked, I have a jsfiddle somewhat similar to my code. Here it is: .

My question: How do I make the multi-select accept colour at initialization rather clicking on it to have it be coloured?

Thanks for your time!



I’m not quite sure what you mean by “accept color”, but I’m guessing—based on the behavior of the fiddle you provided—that you want the “box” that displays the items the user has selected to be red. If that’s correct, this bit of CSS will do it for you:

.select2-selection.select2-selection--multiple {
  background: red;


That will change the color for every compoment in the page. What if I have several components and I want a different color for each of them? How is it possible to define the background color of selections at the initizalization of the component?