This note has an interactive demo. Try it in the original

You can paint any piece of text on a page without wrapping it in a <span> or a <mark> : the CSS Custom Highlight API has been Baseline since March 2026, when Firefox 149 shipped the last missing piece, the ::highlight() pseudo-element.

Type something in the demo above. Every match turns orange, but keep an eye on the middle counter: the number of DOM nodes inside the text doesn't move. Start the read-along or flag the typos and it still doesn't move. In a browser without the API, the demo falls back to real <mark> elements and you can watch that counter grow and turn orange.

Why this matters

The classic way to highlight search results is to rewrite the HTML: split text nodes, wrap the matches in elements, and undo it all on the next keystroke.…