Repository navigation
[css-mediaqueries] Should prefers-color-scheme in iframes be context-dependent? #7493
Description
This is a follow-up for #7213.
It seems in that issue, we were in general agreement that doing this for images and maybe even same-origin <iframe>s would be ok, but @tabatkins and @smfr mentioned that cross-origin frames might not be ok, and I'm curious about the reasoning for that, since other similar alterations like #4772 have no same-origin restrictions. When I talked about this with the security folks at Mozilla, there didn't seem to be a particularly interesting attack vector here.
This would be useful both for consistency, but also because it would allow use cases like #7213 (comment) to work. Otherwise, there's no way to have a transparent iframe without coordination with the embedder page, even if the embedded page could support both light and dark color schemes.
cc @smfr, @chrishtr, @lilles, @tabatkins
Activity
chrishtr commentedon Jul 13, 2022
If there are no useful attack vectors then I agree it should also be context-dependent in cross-origin iframes.
css-meeting-bot commentedon Aug 1, 2022
The CSS Working Group just discussed
prefers-color-scheme and iframes, and agreed to the following:RESOLVED: Context-dependent color scheme propagation works for iframes (including cross-origin) unless specifically restrictedThe full IRC log of that discussion
<fantasai> Subtopic: prefers-color-scheme and iframes<bramus> @florian I will keep on tweaking … had already done so a bit
<TabAtkins> github: https://github.com//issues/7493
<fantasai> astearns: Should prefers-color-scheme in iframes be context-dependent?
<fantasai> TabAtkins: yes
<fantasai> TabAtkins: proposed resolution is that we propagate used color scheme to embedded documents, regardless of cross-origin status, by default
<florian> s/@florian I will keep on tweaking … had already done so a bit//
<fantasai> emilio: not used color scheme exactly, like before
<fantasai> TabAtkins: however we define propagation, we do the same for iframes
<fantasai> dholbert: Is there a term for the actually used color scheme?
<fantasai> TabAtkins: the actually rendered one is the "used color scheme"
<fantasai> emilio: but that's not what we want to propagate
<TabAtkins> TabAtkins: not quite in all cases - see preivou sissue
<fantasai> emilio: in the case of a page that doesn't specify a color scheme, we *use* light, but the preference is context-dependent and could be dark
<fantasai> astearns: So the thing we resolved on in the last issue, happens in all embedding contexts
<fantasai> TabAtkins: unless otherwise specified
<fantasai> TabAtkins: there are some embedding context we will restrict this
<fantasai> astearns: objections?
<fantasai> RESOLVED: Context-dependent color scheme propagation works for iframes (including cross-origin) unless specifically restricted
jtbandes commentedon Aug 7, 2025
@pxlcoder hi, just wondering if there's any update on this in Safari yet? (https://bugs.webkit.org/show_bug.cgi?id=284973)
@media (prefers-color-scheme: dark) inside iframe not matching when t…
[css-color-adjust-1] Rework color scheme stuff to reflect f2f resolut…