v135 · css / ux
Highlight Theme Gallery
Browse pre-built ::highlight(find-in-page) themes. Select a theme and the CSS is injected live — use Ctrl+F (or Cmd+F) to trigger browser find-in-page and see the custom highlight style replace the browser default.
::highlight(find-in-page) pseudo-element (alongside the custom highlights API ::highlight(name)). You can set background-color, color, and text-decoration to override the browser's default yellow highlight — useful for dark-mode pages and high-contrast themes.
Highlight themes
Article — use find-in-page to see highlights
The Web Platform has long supported text selection styling via the ::selection pseudo-element. Chrome 135 extends this pattern to find-in-page results, allowing authors to customize how the browser highlights search terms.
This is particularly important for dark-mode designs where the default yellow highlight can be nearly invisible against dark backgrounds. A custom highlight pseudo-element lets the page specify colors that always have sufficient contrast.
The ::highlight(find-in-page) pseudo-element supports background-color, color, and text-decoration properties. Combined with CSS custom properties and media queries, teams can ship themes that respect both light and dark operating-system preferences automatically.
Performance remains excellent because highlight pseudo-elements do not trigger layout — they only affect paint, similar to how ::selection works today.
Applied CSS