`::target-text` CSS pseudo-element

Baseline Newly available

This feature works across the latest devices and browser versions. This feature might not work in older devices or browser versions. It's been available across browsers since December 2024.

The ::target-text CSS pseudo-element represents the text that has been scrolled to if the browser supports text fragments. It allows authors to choose how to highlight that section of text.

The ::target-text pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section.

Syntax

::target-text {
  /* ... */
}

Examples

Highlighting text fragments

::target-text {
  background-color: rebeccapurple;
  color: white;
}

To see this CSS in action follow the link to scroll-to-text demo.

Specifications

Specification
CSS Pseudo-Elements Module Level 4 # selectordef-target-text

Browser compatibility