Back
Earl Carlson

Changing the Default Text Selection Colors in Modern Browsers

Changing the Default Text Selection Colors in Modern Browsers

by Earl Carlson Jul 3, 2012

If you are using a modern browser, you may have noticed when you select text on our website that it has a yellow background instead of the standard blue selection.  This is a simple change that you can make to your website today to add a small bit of flair.

At the time of this writing, text selection is supported in the latest versions of Chrome, Safari, Firefox, Opera, and Internet Explorer (whoa?!)



		/* webkit, Opera, IE9 */
		::section {
			background: purple;
			color: white;
		}
		
		/* Mozilla Firefox */
		::-moz-selection {
			background: purple;
			color: white;
		}

This sentence will be highlighted in red

This sentence will be highlighted in green

This sentence will be highlighted in purple

This sentence will inverted

Back