#1120: CSS find-in-page highlight pseudos

Visit on Github.

Opened Jul 14, 2025

こんにちは TAG-さん!

I'm requesting a TAG review of the new highlight pseudo-element, ::search-text

This pseudo-element exposes find-in-page search result styling to authors, including selection and spelling errors. It allows authors to change the foreground and background colors or add text decorations, which can be especially useful if the UA defaults are insufficiently contrasted with the page colors or otherwise unsuitable.

Specification

https://drafts.csswg.org/css-pseudo-4/#selectordef-search-text

Explainer

https://github.com/Igalia/explainers/blob/main/css/find-in-page/README.md

Links

The specification

Where and by whom is the work is being done?

  • GitHub repo: https://github.com/Igalia/explainers/tree/main/css/find-in-page
  • Primary contacts:
    • Delan Azabani (@delan), Igalia
    • Jihye Hong (@jihyerish), Igalia
    • Stephen Chenney (@schenney-chromium), Igalia
  • Organization/project driving the specification: Igalia
  • This work is being funded by: Bloomberg and Igalia
  • Primary standards group developing this feature: CSSWG
  • Incubation and standards groups that have discussed the design:

Feedback so far

You should also know that...

No response

<!-- Content below this is maintained by @w3c-tag-bot -->

Track conversations at https://tag-github-bot.w3.org/gh/w3ctag/design-reviews/1120

Discussions

Log in to see TAG-private discussions.

Discussed Jul 28, 2025 (See Github)

Xiaocheng: Still reading Matt's comment in the brainstorming thread, which is one minute old. ... My concern here is that the design is very centric to the behaviour of Chrome and Firefox and it might not work on Safari. The proponents also said that they do not expect Safari to implement. I wonder what this means. No interoperability?

Martin+Lola: Not really acceptable.

Lola: Anything from Safari on this?

(Tess says that this is not possible.)

Lola: Negative?

Martin: Interop is voluntary, but no point if there is no hope of interoperability.

Marcos: Igalia is implementing on Blink. Interesting that they didn't see WebKit as a problem.

Christian: This is tough. The use case (sort of) makes sense. Interest from implementers. Not having interoperability is not great.

Lola: There are CSS highlight things going on elsewhere. Firefox did something in the recent release; Firefox exposes this to a11y, but Chrome doesn't. Interoperability for this stuff is already called into question. To have a major browser not be able to implement might make this worse than better.

Matthew: There have been discussions about the semantics of highlights. This case is separate to those. These do need to be exposed to a11y. Like to +1 to Christian about the use case and an opportunity to improve a11y. The proposal might not work, but it is nicely consistent with other highlighting APIs, so it would be nice if it was possible.

Lola: Can we ask that they work with Safari? So that we get interoperability. The other highlight isn't necessarily the same feature, but because this is highlights in general, I'm concerned about lack of adoption from developers, because brittle features won't be used. Also, I'm not won over, just because developers want this. Need to consider the impact on users being inconsistent or negative.

Martin: That's what we do.

Lola: I'm not in favour of saying satisfied for this reason.

Matthew: We all want the problem solved, but we know that solving the problem would mean no interoperable solution. The issue that I've linked from my comment talks about Safari. That might be because their colours are fixed. Possibly something to do with system colours might provide a way to smooth this out. Right now we can't say that it needs to happen this way.

Lola: Does that help, Xiaocheng?

Xiaocheng: Are we going to suggest that they investigate other alternatives that are interoperable? Something like "we acknowledge the value of the use case"... There are good parts of the proposal. The consistency with other highlight pseudo-classes. How many of us thinks we should raise this non-interop concern.

(Virtually unanimous concerns with interop.)

Xiaocheng: I'll draft a comment with two points: the use case is legit and we like the consistency with existing highlight patterns BUT we don't like that this isn't interoperable.

Martin: What about Safari and the other highlights? Because if that has shipped, an alternative design here might make it impossible to have consistency across those highlight types, which is unfortunate.

Discussed Aug 4, 2025 (See Github)

Matthew: Think Xiaocheng has a proposed comment, looks good. Think we should post it.

Hadley: Up for doing that?

Matthew: Will post it.

Hadley: Give Xiaocheng credit when posting the closing comment.

Marcos: Probably not needed, TAG should speak as one voice.

Hadley: But we also shouldn't take work from others. Let's balance that.

Comment by @matatk Aug 7, 2025 (See Github)

Hi @jihyerish, the TAG discussed it at a Breakout today, and found that:

  • The use case is strong, and the proposed feature solves it nicely while being consistent with the existing highlight pseudos
  • However, we are concerned that the feature is not implementable on Safari, and therefore, will break the interoperability of the Web

Have you explored alternatives that can mitigate the interoperability issue? A good starting point is https://www.w3.org/TR/design-principles/#implementability

Thank you!

Discussed Aug 11, 2025 (See Github)

Matthew: I'll need to look at this more. Touches on how browsers should present things to people. If Safari guarantees no contrast issues, question is if author provided styles and didn't use @supports, is this a problem? But don't want you to have to do that. I'll ask the CSS people.

Discussed Aug 11, 2025 (See Github)

Martin: We were talking about the response here. Not sure we need to get into details but I don't find response satisfactory. @supports isn't really for feature-detecting forever. I am overloaded with issues.

Matthew: Maybe Marcos? It changes the presentation. Would you need to use @supports? Maybe Safari would overload and ensure good contrast. If you don't, is it acceptable outcome?

Lola: I'd like to avoid getting in the weeds of these issues, there are 11 to get through. Let's assign and get into the weeds in the breakouts. Matthew are you OK being the only assiggnee to this?

Matthew: We'll need some CSS input. Do we want an associate specifically for CSS? Maybe Peter, but not sure how busy he is.

Hadley: Peter is unlikely to be associate given demands on his time, but he could probably help with an issue.

Lola: Unless we have a specific person in mind, we should move forward with people like Peter. Maybe we can ask Peter to look at urgent things, the rest we can split amongst ourselves.

Hadley: Other CSS-focused TAG alumns, Tess, Lea...

Matthew: Let's look at the other issues, I can be the only person on this for now.

Discussed Aug 18, 2025 (See Github)

Lola: I was looking at this earlier. Matt posted comment 2 weeks ago, no resolution. Asked them about Safari, they responded.

Matthew: They allude to it being detectable with @supports. But it overwrites what author does. So I'm not sure you acutally need to query it as an author. I think it's OK that Safari won't implement it because they don't need to.

Jeffrey: Concern in blink-dev thread is that this shouldn't be a feature.

Matthew: From a11y perspective I'd have to agree. But seems to violate cardinal principle that you don't tell browsers how to do their UI.

Jeffrey: We probably wouldn't standardize what happens. But if devs forget to do this, it's bad for users. So we should do the right thing for users

Matthew: Not sure I agree with this, but brainstorming: should you be able to impart a personality for this, like with a dark-mode? But maybe you shouldn't have to do that, UAs should do it for light-sensitive users. Could make same argument.

Lola: I have concerns from a11y perspective but haven't fleshed those out. There are a11y issues with highlight in general. If Safari UI is better for a11y,

Jeffrey: different from dark mode, that's the whole page, all colors need to work together. But this is one chunk of text. So browsers' problem is easier.

Matthew: I agree, just want to make sure reasoning is sound. It's about a small portion of content at one time. Bad if inaccessible. Not covering keyboard interactions, right? Cooperating iwth existing browser UX.

Dan: Yes

Matthew: So browser is doing most of a11y effort here. Just for colors...probably preferable for browser just to do it.

Lola: What's the concern? I'm using non-Chrome chromium browser, browser already does this. When I search, it highlights search text.

Dan: Bro2wser UI might have lack of contrast with site content.

Lola: We can rely on UA for this, but don't need to. Different from dark mode, but similar enough. If I control the design of the website, I want to control the design of things and make sure the colors work. Why would we want to default it to the UA?

Matthew: It takes control away if we say the UA should do it. It would also guarantee sufficient contrast. In theory user could change in UA settings, like a theme. With Safari you don't have the control of theming, but they provide a consistent and clear look and feel. You're taking control from the site in exchange for it being consistent across sites. You're relieving the developer of the burden to get the constrasts right.

Jeffrey: Dan also pointed out authors can attack users with this by disabling find on page, which is reason not to do this.

Lola: Do we want to resolve unsatisfied?

Matthew: I propose to draft comment that puts it to them, why not just expect UAs to do this? Plus other points we discussed. Would like to hear their response even if we disagree.

Discussed Aug 25, 2025 (See Github)

Matthew; I proposed a comment last week and had a response from Jeffrey. He is asking to substitute something. I am fine with changes he proposed. If you are happy with mine and Jeffrey's sugegstion, then I can post it. I put a link to it.

Lola: yes please.

Matthew: just did.

Martin: JEffrey's comment is to recognise the background colours.

Lola: I think this is fine.

Matthew: so I will post it.

Comment by @schenney-chromium Aug 28, 2025 (See Github)

Thanks for the feedback and the time you've spent reviewing.

I'll address the potential for abuse first. I feel there are easier ways for a page to be abusive than messing with find-in-page (and pages can already completely capture the keyboard shortcuts for find-in-page). For example, authors can set transparent background-color for selection styling, removing feedback of what has been selected. It's clearly bad for users when there is no feedback of selected content, but all browsers allow it and have for a long time.

You raise a very good point regarding various color-modifying settings, like CSS forced-colors and prefers-reduced-contrast. We should amend the proposal to say those settings override author defined colors, as they do for things like caret color and selection.

I have considered the "modify the colors based on contrast assessment" and the challenge is determining what the background is. In most cases it's tricky, let alone if a background image is present. I believe that's the motivation for Safari's overlay under the results to eliminate background influence. I think to make an automated contrast approach work the other browsers would need to implement something like Safari, which was actually a proposal raised in the Blink Intent to Ship process.

In response to all this I will update the explainer with the alternatives proposed here, restart the Blink Intent discussion, and talk to the people involved in the CSS spec issue. Hopefully some consensus can be reached.

Discussed Sep 1, 2025 (See Github)

Dan has been going back and forth on the blink-dev thread on this one.

Are devs asking for this because browsers are doing the wrong thing? If so, browsers can fix bugs. If not, then what are the developers needing from this.

Jeffrey: I suggest we just endorse Dan's feedback.

Martin: Interoperability ... depends what you're trying to do. If you meant to highlight the line instead of just the text, Safari won't do that.

Marcos: Might be platform-wide ability to do it.

Martin: Might be things you can't do with it, like override color. You've done a find, and there's color, and you can't override that. But could be the case that there's value in having Safari implement some of this, so when you do find-in-page, the website knows what parts are found, and do other styling around it.

Jeffrey: That sounds like a recommendation that Safari look harder at certain parts of the use case, in particular "highlight things around the match".

Martin: Or draw big arrows pointing to it.

Jeffrey: I think I just volunteered to draft a comment. Argh.

Comment by @bramus Sep 2, 2025 (See Github)

In addition, have you considered possible abuse scenarios? I.e. under the proposed approach, authors could set colors that effectively disable the find-in-page feature.

I don’t think this is a strong argument, as the same thing can be said about any CSS feature. E.g. What’s preventing an author from setting a text’s color to white on a white background? What’s preventing an author from giving an element an opacity of 0? What’s preventing an author from setting a ridiculously small font-size? What’s preventing authors from removing underlines from links? …

Comment by @matatk Sep 8, 2025 (See Github)

Thanks @schenney-chromium and @bramus for your input.

This message is just from me personally...

Restoring the discussions you mentioned @schenney-chromium, sounds to me like a good approach. We'll look forward to reading the Explainer updates (please could you also include the possible abuse case we mentioned, and any others that occur to you?)

@bramus: You're right, of course, that there are far more impactful CSS features that could be misused or abused. You picked some particularly good examples. WCAG aims to protect against misuse, whilst still giving designers freedom. For active abuse, there are other measures, both technical and non-technical that could be used, but all of the features you mention involve some risk.

Documenting abuse cases is intended to help with the design and review process, and future reference. Ideas for mitigations often come out of discussion of the abuse cases. Of course, when weighing up the benefits and risks of this proposal, all the factors you mentioned should be borne in mind.

I hope that clarifies the reason for the ask.

Comment by @bramus Sep 9, 2025 (See Github)

@matatk Thanks for clarifying. I read your initial comment more as an argument against the feature, whereas you want to make sure that this question was covered as part of the design process.

Comment by @matatk Sep 10, 2025 (See Github)

Hi again all. We have just discussed this again in a TAG call, and we see that the blink-dev discussion is progressing. As is being discussed there, it would be great to have more input from developers as to their needs (if you have any research on this, please do also include it in the explainer).

We were wondering in our call: could you use something like :has(::search-text) on a table row to cause it to be highlighted if the row contains a match somewhere? Are there other things that you could only do if this was shipped (as opposed to having the UA control the colors)?

We're also wondering if you are planning to pause on this whilst the blink-dev discussion is in progress (looking at the thread, it seems so), or whether you're intending to ship this proposal soon?

I should've labelled this issue appropriately to indicate that we await the explainer updates discussed above, so I'll do that now. We look forward to following the blink-dev discussion, and hearing more here as you have it. Thanks again.

P.S. If it's of interest, the URL for our minutes for this week should work at the end of this week (time zone-dependent).