How to Change Selection Color in Browser Using CSS

Changing the text selection color is always a nice touch, it shows that you’re paying attention to the finer details of the site.

Here is the code to change selection color in browser using CSS:

Change Selection Color in Browse

This will change the default selection color of your browser/OS to orange one as you can see in the picture.

Test the code live here.

Browser support

The browser support for this selector is pretty good nowadays, it’s supported by all the latest versions of the most popular browsers and even Internet Explorer supports it in IE10, so you won’t run into any difficulties to change selection color in browser using CSS, especially as it will simply be ignored in any browser that doesn’t support it.

One thing to keep in mind is that this selector was in the drafts of CSS3 but it was later removed because its behavior was under-specified, especially within nested elements.

You Might Interested In

Leave a Reply

Enclose a code block like: <pre><code>Your Code Snippet</code></pre>.