The ::selection CSS pseudo-element applies rules to the portion of a document that has been highlighted (e.g. selected with the mouse or another pointing device) by the user.

Only a small subset of CSS properties can be used in a rule using ::selection in its selector: color, background-color, cursor, outline, text-decoration, text-emphasis-color and text-shadow. Note that, in particular, background-image is ignored, like any other property.

text-shadow in ::selection is supported by Chrome, Safari and Firefox 17+.

Though this pseudo-element was in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase, as it appeared that its behavior was under-specified, especially with nested elements, and interoperability wasn't achieved (based on discussion in the W3C Style mailing list).

The ::selection pseudo-element has been added again in Pseudo-Elements Level 4.


Gecko is the only engine requiring the prefix. Due to the fact that the CSS parsing rules require dropping the whole rule when encountering an invalid pseudo-element, two separate rules must be written: ::-moz-selection, ::selection {...}. The rule would be dropped on non-Gecko browsers as ::-moz-selection is invalid on them.


<div>This is some text for you to test CSS's ::selection pseudo-class.</div>
<p>Also try to select some text in this &lt;p&gt;</p>


/* draw any selected text yellow on red background */
::-moz-selection {
  color: gold; background: red;

::selection {
  color: gold; background: red;

/* draw selected text in a paragraph white on black */
p::-moz-selection {
  color: white;
  background: black;

p::selection {
  color: white;
  background: black;



Specification Status Comment
CSS Pseudo-Elements Level 4
The definition of '::selection' in that specification.
Working Draft Initial definition

The ::selection CSS pseudo-element was drafted for CSS Selectors Level 3 but removed before it reached the Recommendation status. It was readded as part of the Pseudo-Elements Level 4 draft.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1 1.0 -moz[1] 9 9.5 1.1
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support ? ? ? ? ? ?

[1] Gecko currently only supports the prefixed version ::-moz-selection. It will be unprefixed in bug 509958.

Document Tags and Contributors

 Last updated by: cvrebert,