Skip to main content

Change highlight colour of select2 option

Select 2 is a popular jquery plugin for better select drop down lists. Styling it is a bit painful. Here’s how you change the highlight colour of the dropdown.

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: red;
  color: #fff; 

// Remove focus outline
<pre class="default prettyprint prettyprinted"><code><span class="pun">.</span><span class="pln">select2-container </span><span class="pun">*:</span><span class="pln">focus </span><span class="pun">{</span>
        <span class="kwd">outline</span><span class="pun">:</span><span class="pln"> none</span><span class="pun">;</span>
 <span class="pun">}</span></code></pre>

Leave a Reply